0

<script>ボタンが押されるたびに、javascript と jQuery を含むタグを html ファイルに動的に追加しています。.clickすべてが正しく追加されますが、2 つのjQuery アクション関数のうちの 1 つだけが機能しています。理由が分からないようです。コンソールにエラーはありません。正しい場所で使用\'したことを確認しました。\"

$('#classBox').append('<tr id=\"' + tempCHAR + tempNUM + '\">' 
                + '<td>' 
                    + '<i id=\"' + tempCHAR + tempNUM + '\" class=\"icon-remove-sign\">'
                    + '</i> '
                    + '<a id=\"' + tempCHAR + tempNUM + '\"" href=\"https://cms.psu.edu/section/default.asp?id=' + urlHOLDER + '\" target="framehidden">' 
                        + tempYEAR + ': ' + tempCHAR + tempNUM + ', Section ' + tempSEC 
                    + '</a>'
                + '</td>'
            + '</tr>'
            + '<script>'
                + '$(\'#' + tempCHAR + tempNUM + '\').click(function() {'
                    + '$(\'tr\').remove(\'tr#' + tempCHAR + tempNUM + '\');'
                + '});'
                + '$(\'a#\'' + tempCHAR + tempNUM + ').click(function() {'
                    + '$(\'#framehidden\').attr(\'src\', $(\'a\', this).attr(\'href\')));'
                + '});'
            + '</script>');

インデントは、私がやっていることをより簡単に読むためのものです。それは問題ではないでしょうか？

それが読めない場合は、通常のビューで表示されます。

$('a#'IST130).click(function() {
    $('#framehidden').attr('src', $('a', this).attr('href')));
});  
$('#IST130').click(function() {
    $('tr').remove('tr#IST130');
});

他に 30 個ほどの.click機能があり、すべて完璧に機能しますが、ここで何が問題なのかわかりません。ヒントはありますか？

4

4 に答える 4

2

インスタント（つまり同期）であるため、そのようなものをタグ.append()に入れる必要はまったくありません。<script>代わりに、これを試してください：

$('#classBox').append('<tr id=\"' + tempCHAR + tempNUM + '\">' 
            + '<td>' 
                + '<i id=\"' + tempCHAR + tempNUM + '\" class=\"icon-remove-sign\">'
                + '</i> '
                + '<a id=\"' + tempCHAR + tempNUM + '\"" href=\"https://cms.psu.edu/section/default.asp?id=' + urlHOLDER + '\" target="framehidden">' 
                    + tempYEAR + ': ' + tempCHAR + tempNUM + ', Section ' + tempSEC 
                + '</a>'
            + '</td>'
        + '</tr>');
$('#' + tempCHAR + tempNUM).click(function() {
    $('tr').remove('tr#' + tempCHAR + tempNUM);
});
$('a#' + tempCHAR + tempNUM).click(function() {
    $('#framehidden').attr('src', $('a', this).attr('href')));
});

そうは言っても、あなたのコードはひどく無効です。ID は一意でなければなりません。あなたに最適な方法でそれを修正するのはあなたに任せますが、ええ。

于 2013-04-02T19:11:16.037 に答える
2

エラー (または少なくとも 1 つ) は次の行にあります。

+ '$(\'a#\'' + tempCHAR + tempNUM + ').click(function() {'

$()ブロックの最後に移動する必要がある余分な一重引用符をそこに置くだけです：

+ '$(\'a#' + tempCHAR + tempNUM + '\').click(function() {'
于 2013-04-02T19:08:00.070 に答える
1

最後のあなたの例では、$('a#'IST130). 確かに$('a#IST130)`

これを修正するには、その ID の世代を次のように変更します。

'$(\'a#' + tempCHAR + tempNUM + '\')...

さらに、要素を動的に追加しているため、コードが実行されている正確なタイミングによっては、クリック イベントが適切にバインドされない場合があります。

jquery onを使用して、永続的な要素のイベントのバインドを設定できます。この場合#classBox、良い賭けのように見えます。これは次のようになります (これは通常のスクリプト ブロックの内側で、動的なものの外側になります:

$('#classBox').on('click','a',function () {
    $('#framehidden').attr('src', $('a', this).attr('href')));
});

$('#classBox').on('click',function () {
    $(this).closest('tr').remove();
});

注: 完全にテストされていません - ガイドとして意図されています!

于 2013-04-02T19:10:11.193 に答える
0

構文エラーを修正したら、append()コードが実行される前にクリック イベントが添付されていないことも確認してください。

実際のページでコードが実行される順序はわかりません。クリック イベントが追加される前に要素を追加すると、要素がまだ存在しない可能性があります。jQuery のdelegateメソッドを使用して、要素がいつ DOM に追加されても、すべての要素に対してイベントが確実に呼び出されるようにすることができます。

例えば：

$('body').delegate('.anchorClassName', 'click', function(e){});

于 2013-04-02T19:11:49.443 に答える