1

チェックボックスの列を表示する HTML フォームを作成しています。送信をクリックすると、jQuery 関数によってイベントが取得されます。しかし、Firebug net パネルで関数を調べたところ、ボタンを 1 回クリックしただけでも関数が複数回起動することに気付きました。理由はありますか？

HTML:

echo "<form id='massHoursSubtraction'>";
echo "How many hours to subtract? <input type='text' name='hours'><br />";
$entries = 1;
while($row = mysql_fetch_array($members)) {
    $studentID = $row['studentid'];
    echo "<input type='checkbox' name='studentID[]' id='' value='$studentID'>$studentID";
    echo "<br />";
    $entries++;
}
echo "<input type='button' id='submitValues' value='Submit' onclick='javascript:getHours($entries);' />";
echo "</form>";

Javascript:

function getHours(numberOfEntries) {
$(document).ready(function() {
    $("#submitValues").click(function(){
        var str = $("#massHoursSubtraction").serialize();
        alert("How many times?");           
        $.post("output.php", str);                                  
    });
});
}

これはFirebug ネット パネルのスクリーンショットです: http://imgur.com/Z83s5fr これは$_POST文字列です:hours=1&studentID%5B%5D=5112244

4

3 に答える 3

5

onclickボタンとjQueryの両方に属性があり、クリックイベントを登録します。したがって、ボタンをクリックするたびに、少なくとも 1 つのリスナーをクリック イベントに追加します。最初のクリックで 1 回追加し、2 回目でさらに 2 回追加して合計 4 回行いますが、今回はハンドラーが実際に起動します (登録中のため 1 回目ではありません)。

ボタンから属性を削除onclickし、関数を完全に削除して、次のもののみを取得します。

$(document).ready(function() {
    $("#submitValues").click(function(){
        var str = $("#massHoursSubtraction").serialize();
        alert("How many times?");           
        $.post("output.php", str);                                  
    });
});
于 2013-04-07T07:47:22.300 に答える
4

これは、要素をクリックするたびに、submitValuesそこにクリック ハンドラがアタッチされるためです。それがあなたの余分なイベントがどこから来ているかです. 代わりにこれを行う必要があります：

echo "<input type='button' id='submitValues' value='Submit' />"

次に、document.ready がここで発行されたときに、イベント ハンドラーを 1 回アタッチします。

$(document).ready(function() {
 $("#submitValues").click(function(){
    var str = $("#massHoursSubtraction").serialize();
    alert("How many times?");           
    $.post("output.php", str);                                  
 });
});
于 2013-04-07T07:47:22.743 に答える
0

呼び出している関数内に次の行を入れます

$("#IdofButton").removeAttr('onclick');

これにより、ボタンのクリック機能が削除されるため、機能を複数回起動することはできません。

于 2014-10-27T06:56:13.360 に答える