1

選択可能なリストの最初の項目のクリックを実装しようとしています.CSSを追加できますが、最初の項目を事前に選択しようとするとクリックイベントが機能しません(onclickイベントにはajaxがあるため、クリックが必要です)を呼び出して、別の div に関連情報を入力します。) トリガー メソッドを使用しようとしましたが、リストの最初の項目でこれを機能させることができませんでした。コードは標準的なものです。

    <ol id="selectable">
<li class="ui-widget-content">Item 1</li>
<li class="ui-widget-content">Item 2</li>
<li class="ui-widget-content">Item 3</li>
<li class="ui-widget-content">Item 4</li>
<li class="ui-widget-content">Item 5</li>
<li class="ui-widget-content">Item 6</li>
     <ol>

Jquery 関数

        $(function() {
        $( "#selectable" ).bind("mousedown", function (e) {
            e.metaKey = false;
        }).selectable({
             selected: function(event, ui) {

                 alert("selected");

             },
            stop: function() {
                var result = $( "#select-result" ).empty();
                $( ".ui-selected", this ).each(function() {
                    var index = $( "#selectable li" ).index( this );
                    result.append( " #" + ( index + 1 ) );
                });
            }
        });
    });

このように最初のリスト項目にcssを適用できます

    $('li:first-child').select().addClass("ui-selected");

しかし、クリック機能を機能させることができません（クリックすると、「選択された」匿名コールバックが呼び出されます）。

4

1 に答える 1

3

いくつかの試みの後、私はそれを機能させることができました.それが役立つかもしれないので解決策を投稿してください. 選択可能なリストの最初の項目でマウスのクリックをシミュレートしたい.そのためには、最初にバインドする必要があります

$( "#selectable" ).bind( "selectableselected", function(event, ui) {

    $( ".ui-selected", this ).each(function() {
    var index = $( "#selectable li" ).index( this );
    alert("test");


    });
    });

これを実行したら、クリックを起動する必要があります。これを create コールバックに入れます。このコールバックは、selectable が形成されるとすぐに呼び出されます。

    create: function(event, ui) {
            setTimeout( function() {
    $('li:firstchild').addClass("uiselected").trigger('selectableselected');

            }, 100 );

Jquery の優れている点は、その直感的な操作性です。

于 2011-12-13T15:58:11.170 に答える