私が作成している Web サイトのページで、ボタンを押すと、別の php ページのコンテンツがインポートされ、ページに追加されます。ただし、その他のページには JQuery が含まれており、コンテンツをインポートするたびにクリック イベント ($( ".ExpandRoleButton").click) が前の要素で繰り返されます。したがって、3 つの要素を追加すると、
要素 1: クリック イベントを 3 回繰り返す
要素 2: クリック イベントを 2 回繰り返す
要素 3: クリック イベントを 1 回実行する
$("#AjouterPiece").click(function()
{
$.blockUI({ message: '<img src="images/ChargementGeant.gif"/><br/><h1>Un moment svp.</h1>' });
$.post("wizardincl/piste.php", {newPiste: newPiste}, function(data)
{
$("#wizardPistes").append(data);
$.unblockUI();
$(".divNewPiste").fadeTo(300, 1);
$("#nbExemplaires").attr("max", newPiste);
newPiste++
$( ".ExpandRoleButton").click(function()
{
if ($(this).hasClass('RetractRoleButton'))
{
$(this).find('img').attr('src', 'images/ExpandPetitNoir.png');
var that = $(this);
$(this).parent().parent().parent().parent().next().slideUp(500, function() {
that.parent().parent().parent().parent().css('border-bottom', '1px solid #FF790B');
});
$(this).removeClass('RetractRoleButton');
}
else
{
$(this).parent().parent().parent().parent().css('border-bottom', 'none');
$(this).find('img').attr('src', 'images/ExpandPetitNoirRetour.png');
$(this).parent().parent().parent().parent().next().slideDown(500);
$(this).addClass('RetractRoleButton');
}
});
});
});
現在、JQuery Web サイトの一部がダウンしているようで、検索しても問題を解決するものが見つかりません。コードがこのように繰り返されないようにする方法はありますか?