0

メニューがあります：

<ul>
    <li class="expanded">
        <span class="ui-icon">
        </span>
        <span class="ui-icon">
        </span>
        <label>
            <input type="checkbox" name="" value="45">
            111111111
        </label>
        <ul id="ch-content-menu" class="ui-widget-content">
            <li class="expanded">
                <span class="ui-icon ui-icon-triangle-1-se">
                </span>
                <label>
                    <input type="checkbox" name="" value="18">
                    22222222222222
                </label>
                <ul id="ch-content-menu" class="ui-widget-content">
                    <li class="leaf">
                        <span>
                        </span>
                        <label>
                            <input type="checkbox" name="" value="19">
                            33333333333333
                        </label>
                    </li>
                    <li class="leaf">
                        <span>
                        </span>
                        <label>
                            <input type="checkbox" name="" value="20">
                            4444444444
                        </label>
                    </li>
                </ul>
            </li>
        </ul>
    </li>

</ul>

4444444 チェックボックスをクリックすると、2222222 と 1111111 が自動的にチェックされるスクリプトを書きたいと思います。

jqueryでこれを行うにはどうすればよいですか?

4

2 に答える 2

1

「44..」チェックボックス、「22..」チェックボックスおよび「11..」チェックボックスの ID または名前を指定する必要があります。

そのような

<input id="44" type="checkbox"/>
<input id="22" type="checkbox"/>
<input id="11" type="checkbox" />

その後、スクリプトを使用してこれらの要素のアクションを監視できます

$('#44').click(function(){
   $('#22').attr('checked',true);
   $('#11').attr('checked',true);
});

チェックボックスの詳細な操作については、jquery の Web サイトを参照してください。

アップデート

すみません、質問者様の見落としがあるかもしれません。4000 ボックスを出力したい場合は、それを生成するプログラムが必要だと思います。入力によって4000個のボックスを生成しないためです。各要素の ID または名前は、生成規則に従う必要があります。多くの場合、box1、box2、box3 などの頻度番号が使用される可能性があります。したがって、上記と同様にスクリプトを使用します。

1 つの要素がクリックされた場合など、トリガー ルールに従う動的トリガーが必要な場合は、次の 2 つのボックスを同時にオンにします。次に、使用できます

$('input').click(function(){
  var check_index = $(this).index();
  var next1 = check_index+1;
  var next2 = check_index+2;
  $('input#box'+next1+',input#box'+next2).click()});

または、選択用のマッピング オブジェクトを作成できます

var mapping = {
  'box1':'#box4,#box5',
  'box44444':'#box222,#box111'
  ...
}
$('input').click(function(){
   $(mapping[this.id]).click();
});

もちろん、指定されたルールに従って生成するこのマップを生成するプログラムが必要です。ただし、どの方法を使用しても、スクリプトのパフォーマンスを安定させたい場合は、操作する各要素に id または名前を付ける必要があります。

最善の方法は ID を使用することですが、それができない場合は get() を使用する必要があるかもしれませんが、get() は jquery オブジェクトを通常の DOM オブジェクトに取得するため、再度 $() でラップする必要があります。

var ul3 = $('ul').get(3) // get the last ul
var target = $(ul3).find('input').get(1) // get the 4444 input
$(target).click(function(){
  var ul1 = $('ul').get(0) // get the first ul
  var inputs = $(ul1).find('input') // get all input element under the first ul
  $($(inputs).get(0)).click(); // get and click the first input element
  $($(inputs).get(1)).click(); // get and click the second input element
})

お役に立てば幸いです。

于 2013-07-16T09:15:01.353 に答える
-1

入力フィールドが少ない場合は、入力フィールドに id 属性を追加するのが最善の方法ですが、次の jquery コードを試すこともできます。

$('label').click(function(){
    text = $.trim($(this).text())
    if (text == '4444444') {
        $('label').each(function(){
            text = $.trim($(this).text())
            if (text == '2222222' || text == '1111111') {
                $(this).children().attr('checked', true)
            }
        })
    }
})
于 2013-07-16T09:26:56.200 に答える