jqueryを使用してjavascript関数の変数を呼び出す方法を変更しますか？

Question

は、このようなHTMLページがあります：

のjavascript機能私は、ユーザーがこれをクリックすると、値が '1' '2' とのJavaScript関数（addplaylist）内を変更したい

addplaylist('shv231a','1'); 
    addplaylist('jhr2a13','1'); 
    addplaylist('thy2b1k','1'); 

があります

<div id="list"><a onclick = "javascript:addplaylist('shv231a','1');" href="javascript:void(0);">+</a></div> 
<div id="list"><a onclick = "javascript:addplaylist('jhr2a13','1');" href="javascript:void(0);">+</a></div> 
<div id="list"><a onclick = "javascript:addplaylist('thy2b1k','1');" href="javascript:void(0);">+</a></div> 

<a id="make2" onclick="" href="javascript:void(0);">Change the value 2</a> 

どうすればjqueryで行うことができますか？

Answer 1

jQueryでこれを行う方法は、すべてのJavaScriptコードをHTML内の別のファイルまたはscriptブロックに移動することです。ディスプレイ（HTML + CSS）をビヘイビア（JavaScript）から抽象化する方法

これは、HTMLの再作業を少し必要とします。特に重複したidフィールドを削除して、idを一意にすることができます。さらに、onclickハンドラからjavascript参照を削除します。

<div id="list1"><a>+</a></div> 
<div id="list2"><a>+</a></div> 
<div id="list3"><a>+</a></div> 

jQueryを使用すると、JavaScriptから直接これらのリンクの動作を指定できます。これは、これは可能な解決策である、プレイリストへのリンクと '2' を渡すためにそれらを変更する1両方のために

$(document).ready(function() { 

    var secondArg = '1'; 

    $('#list1 a').click(function (e) { 
    addplaylist('shv231a1', secondArg); 
    e.preventDefault(); // Don't follow link 
    }); 

    $('#list2 a').click(function (e) { 
    addplaylist('jhr2a13', secondArg); 
    e.preventDefault(); // Don't follow link 
    }); 

    $('#list3 a').click(function (e) { 
    addplaylist('thy2b1k', secondArg); 
    e.preventDefault(); // Don't follow link 
    }); 

    $('#make2').click(function (e) { 
    secondArg = '2'; 
    e.preventDefault(); 
    }); 

}); 

Answer 2

真である：

<a id="make2" onclick="javascript:changeToTwo();" href="javascript:void(0);">Change the value 2</a> 

Javascriptを

function changeToTwo() { 
    $('div#list a').each(function() { 
     $(this).attr('onclick', $(this).attr('onclick').replace("'1'","'2'")); 
    }); 
} 

場合私は正しいことを覚えています。つまり、同じIDを持つ要素を1つ選択するだけなので、クラスセレクタに移動することを検討してください。

Answer 3

<div id="1" class="list"><a>+</a></div> 
<div id="2" class="list"><a>+</a></div> 
<div id="3" class="list"><a>+</a></div> 

のjavascript：

$('.list').each(function (index, element) { 
    addplaylist(element.id); 
}); 

Idsはページ 2）に固有でなければなりません1）） 3を選択したマークアップ

HTMLのあなたの機能コードを維持するためにクラスを使用します