1

だから、JavaScriptをHTMLに混ぜるのは頭の中でも悪いことだと理解しています。しかし、このコードを見てみましょう（リストからアイテムを削除したい）

.
.
.
<div>item1 <a href="#" onclick="return deleteThisItemById (1);">delete me</a><br />
<div>item4 <a href="#" onclick="return deleteThisItemById (4);">delete me</a><br />
<div>item5 <a href="#" onclick="return deleteThisItemById (5);">delete me</a><br />
.
.
.

このリストは PHP によって生成されます。deleteThisItemById() は外部.jsファイルにあります。これはまだ悪いと見なされますか？もしそうなら、標準的な解決策は何ですか？未加工の JavaScript と同様に、jQuery も使用できます。

4

4 に答える 4

4 
$(function() {
  $('a#my_id1').click(function() {
    var myId = $(this).attr('id');
    return deleteThisItemByID(myId);
  });
});

<div>
    item1 
    <a id="my_id1" href="#">delete me</a>
</div>

ところで、あなたの HTML は無効です。不適切にネストされた div タグがあります。

于 2013-02-18T01:08:41.583 に答える
4

シンプル...削除したいアイテムにクラスまたはIDを指定します（アイテムが1つだけの場合にのみIDを使用してください）

<div>item1 <a href="#" class='deleteMe'>delete me</a><br /></div>
<div>item4 <a href="#" class='deleteMe'>delete me</a><br /></div>
<div>item5 <a href="#" class='deleteMe'>delete me</a><br /></div>

次に、要素を jQuery でターゲットにします

$('.deleteMe').on('click', function(event) {
    $(this).remove();
});

注... div 全体を削除する場合は、このセレクターを使用します。

$('.deleteMe').closest('div').on('click', function(event) {
    $(this).remove();
});
于 2013-02-18T01:09:25.867 に答える
1

これらのオブジェクトを表す dom 要素の「data-」属性に、ID や同様のメタデータを隠しておきたいと思います。

この場合、通常は同様の設定を使用します

<ul class="posts">
  <li class="post" data-post="####">
    <p>content...</p>
    <ul class="actions">
      <li>
        <a class="delete">delete</a>
      </li>
    </ul>
  </li>
</ul>

次に、ページの下部に含まれる .js ファイルで:

$('.posts').on('click', '.actions .delete',
function() {
  // which post should be deleted?
  var $post = $(this).closest('.post');
  // remove the DOM element
  $post.remove();
  // some sort of ajax operation
  $.ajax({
    // url, dataType, etc
    data: { post_id: $post.data('id') }
  });
});

この 1 つのハンドラーは、メイン リスト内のすべての「.action .delete」要素に適用されます。つまり、ajax を使用して時刻を変更またはリストに追加するローダーまたはページネーションを追加する場合でも、1 つのイベント ハンドラーがうまく機能します。 .

于 2013-02-18T01:38:39.103 に答える