1

selectedIndexまたはvalがjQueryで設定されている場合、選択フィールドで変更イベントをトリガーすることは可能ですか?

試してみましたが、うまくいかないようです。選択フィールドを独自のデザインに置き換えようとしています。問題は、変更イベントを選択フィールドに添付した場合、インデックスが変更されたときにそのイベントを発生させる必要があることです。

これを行う方法はありますか?

var a = $("a");

$("a").on("click", function() {
  
  $("#selectList")[0].selectedIndex = a.index($(this));
  
    //now fire event

	return false;
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#">Trigger 1</a>
<a href="#">Trigger 2</a>
<a href="#">Trigger 3</a>

<select id="selectList">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
</select>

EDIT: @ xSaint32は、jQueryのトリガーメソッドを使用してこれに答えました。

4

1 に答える 1

3

@ xSaint32 は、jQuery のトリガーメソッドを使用して、これに答えました。

var a = $("a"),
    select = $("#selectList");

$("a").on("click", function() {
  
  select[0].selectedIndex = a.index($(this));
  
  select.trigger( "change" );

  return false;
});

select.on("change", function() {
  
  alert("My index changed");

  return false;
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#">Trigger 1</a>
<a href="#">Trigger 2</a>
<a href="#">Trigger 3</a>

<select id="selectList">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
</select>

于 2011-07-01T10:08:48.593 に答える