bootstrap data-id在javascript中未定義

Question

我試圖獲取綁定到模式的data-id的值。 這是代碼

<i class="fa fa-envelope" aria-hidden="true" data-target="#btnSendSMS" data-toggle="modal" data-id="ISBN564541"></i>

//彈出模型

   <div id="btnSendSMS" style="display: none" class="modal fade TransParentAll" role="dialog">
        <div class="modal-dialog" id="C_Model_Dialog">
            <div class="modal-content" id="C_Model_Content">
                <div class="modal-header" id="C_Model_Header">
                    <h4 class="modal-title">Send SMS</h4>
                </div>
                <div class="modal-body" id="C_modal_body">
                    <form class="AddFreelancerForm">
                        <div class="form-group">
                            <span class="pull-left">SMS</span>
                            <input type="text" id="textSMS" class="form-control" placeholder="write something here" />
                        </div>
                    </form>
                </div>
                <div class="modal-footer" id="C_Model_Footer">
                    <button id="btnsave" type="button" class="btn c_G_Btn pop_upSaveBtn" value="1" onclick="SendSMS()">
                        <i class="fa fa-floppy-o" aria-hidden="true"></i>
                        Send
                    </button>
                    <button id="btnCancel" type="button" class="btn c_R_Btn" data-dismiss="modal" value="1" onclick="CloseWindow()">
                        <i class="fa fa-times" aria-hidden="true"></i>
                        Close
                    </button>
                </div>
            </div>
        </div>
    </div>

// JS

function SendSMS() {
        var candidateId = $(this).data('id');
        var can=$(this).attr("data-id") ;

但是在單擊按鈕時，兩個值都變得不確定。

Answer 1

當您在<button>標簽上編寫click事件時， $(this)將始終引用<button>對象。 因此， var can=$(this).attr("data-id") ; 由於<button>對象沒有名為data-id的屬性，因此將始終返回未定義

如果您嘗試獲取<button>對象的ID，請嘗試以下行

var candidateId = $(this).attr('id');

如果<i class="fa fa-envelope" aria-hidden="true" data-target="#btnSendSMS" data-toggle="modal" data-id="ISBN564541"></i>位於<button>對象，您可以通過以下行獲取data-id ：

var can=$(this).find("i").attr("data-id") ;

即您的代碼將像

function SendSMS() {
        var candidateId = $(this).attr('id');
        var can=$(this).find("i").attr("data-id") ;
}