1

外部のウェブページから読み込まれるリストにソート可能なJqueryを使用しています。ユーザーがタブをクリックすると、liコンテンツがロードされます。これは機能しますが、ソート可能なリストの各li要素にチェックボックス入力を追加しようとしています。

<script type="text/javascript"> // loads slides when user clicks tab
        window.onload = function() {
        var a = document.getElementById("fvsortid");

          a.onclick = function() {
          $("#sortable").load("file.xml");
          $('<input type="checkbox" class="liChk" />').prependTo('#sortable li');
          }

        }   
</script>

チェックボックスが追加されないのはなぜですか？

HTMLは次のとおりです（liリストが外部ページからロードされる前）：

<div id="tabs-2">

        <ul id="sortable">


        </ul>

<div id="adder">
<input class='btn' type='submit' value='Add Slide' />
</div>

    </div>

助けてくれてありがとう。

4

2 に答える 2

0

prependToが呼び出される前に、.load（xmlFile）行の実行またはロードが完了していないように見えます。したがって、liは存在しません。

ロードが完了した後、prepend関数をコールバックにすることができます。

a.onclick = function() {
          $("#sortable").load("file.xml", function(){
                $('<input type="checkbox" class="liChk" />').prependTo('#sortable li');
          });
}

または、500ミリ秒の遅延後にプリペンドを呼び出す方法の例を次に示します。

a.onclick = function() {
          $("#sortable").load("file.xml");
          setTimeout(function(){
                 $('<input type="checkbox" class="liChk" />').prependTo('#sortable li');
          }, 500);
}
于 2012-10-12T16:55:28.197 に答える
0

jQueryを使用しているので、次のようにjQueryのprepend（）を親に直接使用します。

$(document).on('click', '.btn', function() {
    $("#sortable").load("file.xml");
    $("#sortable").prepend('<input type="checkbox" class="liChk" />');
});

</ p>

ここでフィドル：

http://jsfiddle.net/9Ryfg/

于 2012-10-12T16:53:33.460 に答える