Question

我试图找出在单击按钮时如何更新选项菜单。我可以使用$(#id).click(function(){});来完成这项工作，但是当从菜单中选择一个选项时，我还需要调用另一个函数。下面列出的代码不起作用，因为它清除了我的选择菜单。我相信这是因为click事件被调用两次，第一次点击一次，更改后第二次。

如何以我可以使用这两个事件的方式加载选择菜单，我该怎么办？也许我不会以正确的方式解决这个问题，我仍然是ajax和jquery的新手。

我的代码示例：

MyMarkup：

<div class="siteId">   Select Site:<select id="site" name="site" 
style="width: 60px"></select></div>

JavaScript的：

getSiteId: function(){  // fill the option select menu

      $.ajax({

              type: "POST",
              url: "?do=getsiteid",
              dataType: "json",
              async: true,

              success: function(jsonObj) {

                     var listItems= "";                        
                     listItems+= "<option value='empty'></option>";         // fill first entry with a blank value

                       for (var i in jsonObj){

                               listItems+= '<option value=' + jsonObj[i].siteId + '>' + jsonObj[i].siteId + '</option>';
               }
              $("#site").html(listItems);
              }
       }); 
},

我的活动：

  $(document).ready(function() {

  $('.siteId').click(function(){
    Freight.getSiteId();
  });




  $('#site').change(function(){//event to load table based on user selection from menu

var siteId = $("#site").attr('value');
nEditing = null;
if(siteId != "empty"){
    $("#message").hide();  // hide message
    $("#new").show();      // show button
    $('#wrapper').empty(); // 
    $('#wrapper').replaceWith(Freight.tbl);

    Freight.displayData(siteId);

 oTable = $('#grid').dataTable( {
    "aoColumns": [ 
        /* Dest */   null,
        /* Port Id */  {"bSearchable": false,
                         "bVisible":    false},
                    /* woodType */ {"bSearchable": false,
                         "bVisible":    false},
        /* Cont Rate */ null,
        /* Edit */  null
    ]} );
}
    else{
    $("#wrapper").empty();
     $("#message").show();  // hide message
    $("#new").hide();      // show button

  } 
}); // end  



});

Answer 1

因为.click处理程序位于你的.siteId div上，所以当你单击div中的任何内容时都会调用它，包括SELECT菜单。因此，SELECT的.change事件也会触发div的.click事件。我会在“选择网站”文本周围放置一个跨度，并将您的点击事件放在跨度上。

加载选项从服务器中选择

1 个答案: