0

私はここで問題に苦しんでいます。まず、ビジュアル コード: 

<input type="radio" name="user_by_list" value="" id="userbylist"/>
<div id="userbylist1">
    <select>
        <option value="1">1</option>
        <option value="2">2</option>
    </select>
</div>
<input type="radio" name="user_by_text" value="" id="userbytext"/>
<div id="userbytext1">
    <input type="text" value=""/>
</div>

そして、これは私のjQueryコードです:

$("#userbylist").click(function () {
    $("#userbytext").prop('checked', false); // for unchecking the opposite radiobutton
});
$("#userbytext").click(function () {
    $("#userbylist").prop('checked', false); // for unchecking the opposite radiobutton
});

$("#userbylist1").click(function () { // for clicking the whole div
    $("#userbylist").prop('checked', true); // checking #userbylist radiobutton 
    $("#userbytext").prop('checked', false); // unchecking #userbytext radiobutton
});
$("#userbytext1").click(function () { // for clicking the whole div
    $("#userbytext").prop('checked', true); // checking #userbytext radiobutton
    $("#userbylist").prop('checked', false); // unchecking #userbylist radiobutton
});

さて、問題は、選択タグをクリックしてそのdivのラジオボタンをチェックしても機能しないが、テキスト入力領域をクリックすると正常に機能することです。div全体をクリックすると、機能に応じてチェックとチェックが解除されるため、1つでも問題なく機能します。<select>すべてのオプションにクラスを設定し、タグ全体に id を設定しようとしました。ここで何か助けはありますか？

PS。わからない場合は、問題を説明するために最善を尽くしましたが、例のページを設定しました

4

1 に答える 1

0

クリックが機能しない理由は、オプションメニューのポップアップが、クリックのアップ部分がダウン部分が発生したのと同じ要素で発生するのを妨げているためだと思います。

別の方法として、選択した値が変更された場合に .change() が関数を実行し、オプション リストでマウス ダウンするとすぐに .mousedown() が関数を実行します。

    $("#userlist2").change(function () {
      $("#userlist").prop('checked', true);
      $("#usertext").prop('checked', false);
    });

    ...

    <select id="userlist2" name="userlist2">
      <option value="none">Select user</option>
      <option value="none">-----------</option>
      <option value="1">Mike007</option>
      <option value="2">UrbanSurban01</option>
    </select>
于 2012-12-30T22:09:28.713 に答える