javascript - 選択したオプションに応じて JQuery アニメーションを実行する

Question

私はたくさん検索しましたが、誰かが以前にこれを行う必要があったと確信しています。これが重複している場合は申し訳ありません. オンラインで見つけることができる最高のコードのコンパイルであると思ったものを取りましたが、何も動作しませんでした。

構造がおそらくかなりずれていることは知っていますが、なぜこれが間違っているのか誰にもわかりません。

$(document).ready(function () {
  $("select[name='selector']").change(function () {
    $(this).children(':selected').hasClass('three') {
      $("#mover").animate({
        "left": "+=50px"
      });
    };
  });
});

実例。

Answer 1

いくつかのこと：

1. 必要なのは、言語の基本である条件if文です。
2. leftCSS 属性は、絶対配置が使用されている場合にのみ考慮されます。

コードに関しては、

#mover {
    position: absolute;
}

$(document).ready(function () {
    var $selector = $("select[name='selector']"), $mover = $("#mover");
    $selector.change(function () {
        if ($selector.children(':selected').hasClass('three')) {
            $mover.animate({
                "left": "+=50px"
            });
        };
    });
});

ここで見ることができます。

Answer 2

$(document).ready(function() {
    $("select[name='selector']").change(function() {
        if($(".three:selected",this).length>0){       
            $("#mover").animate({"left": "+=50px"});
        };
    });
});

ここ: http://jsfiddle.net/kpT3b/

Answer 3

$(document).ready(function() {

$("select[name='selector']").change(function() {

    if($(this).find('option:selected').text() == "three"){

        $("#mover").animate({"left": "+=50px"});

    }
});
});