如何在ui可选jquery动态更改选项列表

我有一个网站用javascript和jquery编码。我有一个用jQuery-ui selectable创建的选项列表，当点击一个按钮（包含一个javascript代码的按钮）时它将会改变。下面我的一些代码：如何在ui可选jquery动态更改选项列表

拳，我的用户界面，可供选择的代码...

$(function() { 
    $("#selectable").selectable({ 
     stop: function(){ 
      var result = $("#select-result").empty(); 
      $(".ui-selected", this).each(function(){ 
       var seq = $(this).text(); //data -> selected sequence 
       showdata(seq); //TODO when sequence is selected 
      }); 
     } 
    });

在这里，我的代码来构建一套的一个按钮被按下时，将被称为选项...

function showS2P(){ 
    var s = ''; 
    s = s + "<div class=\"listS2P\" align=\"left\">"; 
    //document.write(arrS2P.length); //show number of patterns per selected zone 
    if (arrS2P.length == 0) { 
     s = s + "Any pattern found"; 
    } else { 
     s = s + "<ul id=\"selectable\">"; 
     for (var i=0; i<arrS2P.length; i++){ 
      s = s + "<li class=\"ui-widget-conten\">"+arrS2P[i]+"</li>"; 
      //document.write("<h3> "+i+" -> "+arrS2P[i]+"</h3> <br/>"); 
     } 
     s = s + "</ul>"; 
    } 
    s = s + "</div>"; 
    document.getElementById('selectSeq').innerHTML = s; //selectSeq is a <div> which change when a button is clicked 
    $(selectable).selectmenu("refresh"); 
}

目前，当我点击我的按钮，选项将显示在一个<div>，但作为纯文本（即，它是不可能的点击选项）。请，有人知道我该怎么做吗？

来源

2012-09-27 Alatsal

是最后一行，'$（selectable）.selectmenu（“refresh”）'，意思是'$（“＃selectable”）。selectmenu（“refresh”）'？ –

嗨Will ...是的，但我认为我不需要这条线。我真的是Jquery的新手。 – Alatsal

这确实是“刷新”你的选项列表的线。这就是说，根据[Selectmenu的文档]（https://github.com/fnagel/jquery-ui/wiki/Selectmenu）（向下滚动到“添加/删除/修改选项”），正确的调用实际上是' $（“＃selectable）.selectmenu（）;'，没有参数作为一个侧面说明，我会避免使用普通的javascript，比如'document.write'或'document.getElementById（...）'使用jQuery，因为一致性总是比较容易阅读 –

要添加下一步需要写上点击事件操作：

$("#selectSeq option").live("click",function(){ 
    // Here do something 
    var val = $(this).val(); // value of option; 
    var text = $(this).html(): // text of option; 
});

// PS：不是“#selectSeq”你可以使用选择另一个ID或列表的另一种选择。

来源

2012-09-27 23:07:48

'.live'已被'.on'取代，因此您不应该在新代码中推荐它。 – Barmar

感谢您的早期回答Petro ... I' m试试你的代码... – Alatsal

谢谢Barmar ...作为额外的信息，当我加载我的网页时，** ui-selectable **工作正常，但问题是当我尝试改变**选项列表**使用' document.getElementById（'selectSeq'）。innerHTML' – Alatsal

如何在ui可选jquery动态更改选项列表

回答

相关问题