現在、私は多くの問題を抱えているjQueryスクリプトに取り組んでいます。私はフレームワークの専門家ではありませんが、私はこれまで数多くの場面で成功裏に使用してきました。Jqueryバインディングが失敗しているようです
サブフォームのサブフォームとなる金額を設定しようとしています。私。ユーザは、ユーザ入力の追加のフォームフィールドに基づいてアンケートに記入し、この場合、その入力に基づいてより多くのフィールドを表示することができる。
この場合、制御要素を検索して何かを変更イベントにバインドするスクリプトにロードします。このアプローチは、最初のフォームフィールドでは機能しますが、別のフォームフィールドでは機能しません。コンテンツは、ajax経由ではなく、htmlの残りの部分とともにロードされます。本当に奇妙な部分は、デバッガを使用してコンソールを見れば、私が望む要素を見つけ出してchange()を呼び出そうとしているが、その後イベントが起きないということが分かる!
$('td.subFormYesControl input.CodebtorParentQuestion').each(function() {
console.log("Hit");
//alert($(this).prop('class'));
$(this).on("change", function() {
if ($(this).val() == "1") {
$(this).parents('tbody').eq(0).children('tr.subFormRow').show();
$(this).parents('tbody').eq(0).siblings('tbody.CodebtorSubForm').show();
} else {
$(this).parents('tbody').eq(0).children('tr.subFormRow').hide();
$(this).parents('tbody').eq(0).siblings('tbody.CodebtorSubForm').hide();
}
});
});
私は少しの運勢で試行錯誤テストを行ってきました。私が$(document).ready()
に包まれてからこれを$(window).load()
に変更すると、FFでは動作しますが、IEでは動作しません。
誰でも何が起こっているかも知りませんか?
編集:すべての助けてくれてありがとう!使用している実装には生成されたhtmlがたくさんあるので、ここでは私が操作しようとしているコントロールの親要素があります。もっと役立つかどうか教えてください!
<td class="subFormYesControl"><input type="radio" value="1" id="c1_CodebtorsParent[0]0" class="CodebtorParentQuestion" name="c1_CodebtorsParent[0]"><label for="c1_CodebtorsParent[0]0">Yes</label><br><input type="radio" checked="checked" value="0" id="c1_CodebtorsParent[0]1" class="CodebtorParentQuestion" name="c1_CodebtorsParent[0]"><label for="c1_CodebtorsParent[0]1">No</label><br></td>
EDIT 2:これはもっと奇妙に思えるが、私はヒントを見つけたと思う。以下に示すような単純なアラートを追加した場合:
alert($(this).prop('class'));
$('td.subFormYesControl input.CodebtorParentQuestion').each(function() {
$(this).on("change", function() {
console.log($(this).length);
if($(this).val() == "1") {
$(this).parents('tbody').eq(0).children('tr.subFormRow').show();
$(this).parents('tbody').eq(0).siblings('tbody.CodebtorSubForm').show();
} else {
$(this).parents('tbody').eq(0).children('tr.subFormRow').hide();
$(this).parents('tbody').eq(0).siblings('tbody.CodebtorSubForm').hide();
}
});
});
コードが機能しているようです!アラートを削除すると、動作が停止します。何か案は????
ありがとうございました。私はjsfiddleを準備していて、いくつか一見無関係のプラグインを削除していました。私がintellitextツールのうちの1つを削除したとき、コードはすべてのブラウザで正常に動作するようになりました。私はテストを経て、コードをdocument.readyにプッシュバックすることさえできたので、私はそれに答えて、プラグインの互換性の問題/バグにそれをチョークするつもりだと思う。
ありがとうございました。
jsFiddleに関連するHTMLまたは例を投稿できますか? – j08691
こんにちはGordon、私はconsole.log( "This.length =" + $(this).length);にログラインを変更しました。出力はLOG:これでした。長さ= 1、期待される要素数。デバッガを見ると、オブジェクトは正しく初期化されているようです(名前、ID、期待値)。 – thenorthsider23
@ thenorthsider23。下の私の答えをチェックしてください。 – gdoron