javascript - 如何在找到键之前在 jquery 中追加数据？

Question

您能告诉我如何在找到 key 之前在 jquery 中附加数据吗？我有四个具有相同属性 (data-dropdown="dropdowns_js") 但不同 key (银行、州、地区)的下拉菜单。 。我想在具有 state 键选择器的 state 下拉列表中附加数据。如何找到 `key ？

这是我的代码

$(function(){
  $('.ifsc_getbankbtn').click(function(){
    var option='<option value="ddd">ss</option>';
    //which have  key`state` append options
    $('[data-dropdown="dropdowns_js"]').attr('key')append(
    option

    )
  })
})

https://jsbin.com/rutifesote/edit?html,js,output

按键是下拉属性，请参见 html

Answer 1

您可以过滤元素或使用此选择器:

$('[data-dropdown="dropdowns_js"][key="bank"]')

您还需要向按钮添加 type="button" 或使用 event.preventDefault() 以便表单不会提交。

$('.ifsc_getbankbtn').click(function(event){

  event.preventDefault()

  var option='<option value="ddd">ss</option>';
  //which have  key`state` append options
  $('[data-dropdown="dropdowns_js"][key="state"]').append(option)
  
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<form>
    <span>
        <select  data-dropdown="dropdowns_js" key="bank">
        <option selected="true" disabled="true" value="0">Select Bank</option>
      </select>
    </span>
    <span>
        <select  data-dropdown="dropdowns_js" key="state">
            <option selected="true" disabled="true" value="0">Select State</option>
        </select>
    </span>
    <span>
        <select  data-dropdown="dropdowns_js" key="district">
        <option selected="true" disabled="true" value="0">Select District</option>
        </select>
    </span>
    <span>
        <select data-dropdown="dropdowns_js" key="branch">
            <option selected="true" disabled="true" value="0">Select Branch</option>
        </select>
    </span>

    <button  data-bankdetail="btnbankdetail" class="ifsc_getbankbtn">Get IFSC code</button>
</form>