0

jquery ui( http://jqueryui.com/selectable/ )のデモと同じように、選択可能なボタンを実装するコードがあります。アイテムが選択されるたびに関数をトリガーしたい (アイテム 1、アイテム 2 など)。私はいくつかの試みをしましたが、何もうまくいきません。誰かが私にこれを手伝ってくれませんか。私はこれを試しました：

$(".ui-selected ~ li").click(function() {
alert("hello");
});

これも

$("#selectable li").live('click',function() {
alert("hello");
});

私はまさにこれを持っていますが、他の名前が付いています。私が望むのは、「選択可能な」アイテムが選択されたときに関数を呼び出すことです。

    <style>
  #feedback { font-size: 1.4em; }
  #selectable .ui-selecting { background: #FECA40; }
  #selectable .ui-selected { background: #F39814; color: white; }
  #selectable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
  #selectable li { margin: 3px; padding: 0.4em; font-size: 1.4em; height: 18px; }
  </style>
  <script>
  $(function() {
    $( "#selectable" ).selectable();
  });
  </script>
</head>
<body>

<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>
  <li class="ui-widget-content">Item 7</li>
</ol>
4

4 に答える 4

0

ドキュメントhereによると、ハンドラーをselectableselectedイベントにバインドする必要があります。例えば：

$("#selectable").on('selectableselected',function(event, ui) {
    alert("hello");
});
于 2013-07-07T21:03:33.407 に答える
0

このフィドルは私にとってはうまくいきます。頭の中に次のことを追加していてよろしいですか? css を変更できますが、それらの .js ファイルが存在する必要があります。

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css" />

http://jsfiddle.net/RHUMv/

于 2013-07-07T21:04:01.323 に答える
0

このようにして、選択（または選択解除）が発生したときに関数を実行できます。

$(function () {
    $("#selectable").selectable({
selected: function (event, ui) {
         alert('!')
    },
unselected: function (event, ui) {
       //do stuff
    }
});
于 2013-07-07T21:01:36.163 に答える
0 
$(document).on('click', '#selectable li', function(){
   alert($(this).text());
});

もちろん、これは.readyカプセル化内にある必要があります:)

$(function() {
   // Right here
});
于 2013-07-07T20:58:56.927 に答える