addText()
3 つの変数 ( ) を持つ関数がありますtextInput, type, rowID
。キーワードなしで宣言しましたvar
(関数の外で使用できるようにするためですか?)。この方法で作成した多くのチェックボックスがあります。
<td><input type="checkbox" name="CB" id="monitor_'+rowID+'"/></td>
次に、これらの 3 つの変数を使用する必要があるこの関数があります。
function monitoring(rowID, number, type) {
var $check = $('#status_table #monitor_' + rowID);
$('#test').append($check);
if($check.is(':checked')) {
$.post('/request', {
inputText: number,
key_pressed: type
}).done(function (reply) {
if(reply == "on") {
$('#test').append("on");
} else {
$('#test').append("off");
}
});
}
return;
}
この関数は次の場所で呼び出されます。
$('#status_table #monitor_'+rowID).each(function(rowID, textInput, type){
monitoring(rowID, textInput, type);
});
注:inputText
どこかに投稿された変数です。
質問:
これは、変数を使用してセレクターを呼び出す正しい方法ですか?
$('#status_table #monitor_'+rowID)
コードの 2 番目のセット (セレクター関数と監視関数の両方) で変数を 2 回渡す必要がありますか?
変数を正しく渡すにはどうすればよいですか?
セレクターは正しいですか?または、に変更
$('#status_table #monitor_'+rowID).each(function(){})
する必要があり$('#status_table tr').each(function(){})
ますか?
5. 追加: 「監視」機能をどこで、どのように呼び出す必要がありますか? 私はそれをaddText(以下のコードを参照)の下に置きましたが、「追加」ボタンがクリックされたときにのみ関数が実行されるため、意味がありません。さらに、私のセレクターは変数であるため、チェックされているすべてのチェックボックスに対して実際に同じことを実行できることを確認したいと思います。これどうやってするの?
試してみましたが、チェックボックスをオンにしても、コードがまったく応答しません。
編集:
これが私のaddText()
関数です(上記の別のjQueryアクションの下ではなく、この関数に関数監視を含めました):
function addText(add_type, fb_type) {
$("#" + add_type + "Add").click(function () {
$('.TextInput').empty();
textInput = $("#" + fb_type + "TextInput").val();
if(textInput.length === 0) {
alert('please enter the fieldname');
return;
}
index = $('#status_table tbody tr').last().index() + 1;
type = $("#select-choice-1").find(":selected").text();
rowID = type + textInput;
var str = '<tr id="' + rowID + '">' + '<td>' + index + '</td><td>' + rowID +
'</td><td class="type_row_' + textInput + '">' + type + '</td><td class="feedback number">' +
textInput + '</td>' + '<td><img src="static/OffLamp-icon.png" class="image" id="off"></td>' +
'<td><input type="checkbox" name="CB" id="monitor_' + rowID +
'" class="custom" data-mini="true" /><label for="CB"> </label></td><td class="outputRemove">x</td>' +
'</tr>';
if(alreadyExist(textInput, type)) {
alert('Entry exists. Please enter another number.')
} else {
$('#status_table tr:last').after(str);
}
monitoring(rowID, textInput, type);
return;
});
}
テーブルの HTML:
<table class="config" id="status_table">
<thead>
<tr>
<th colspan="4" ; style="padding-bottom: 20px; color:#6666FF; text-align:left; font-size: 1.5em">Output Status</th>
</tr>
<tr>
<th>Index</th>
<th>Row ID</th>
<th>Feedback Type</th>
<th>Feedback Number</th>
<th>Status</th>
<th>Monitor?</th>
<th>Remove?</th>
</tr>
</thead>
<tbody>
<tr></tr>
</tbody>
</table>