1

成功した通貨コンバーターを実装しようとしていますが、選択した2つのメニュー間で選択したオプションを変更するボタンを実装しています。つまり、最初のメニューで米ドルを選択し、2番目のメニューでポンドを選択した場合です。を選択し、ボタンを押すと、最初のメニューでgbpが選択され、2番目のメニューでusdが選択されます。両方のメニューで選択したオプションを変更できましたが、メニュー自体に表示されません。何を忘れましたか？

 $(function(){
    $('a#switchButton').click(function(){
        var $sel1 = $('#fromCurrency');
        var val1 = $sel1.val();
        var $sel2 = $('#toCurrency');
        var val2 = $sel2.val();
        $sel1.find("option[value='"+val1+"']").attr("selected",false);
        $sel1.find("option[value='"+val2+"']").attr("selected",true);
        $sel2.find("option[value='"+val2+"']").attr("selected",false);
        $sel2.find("option[value='"+val1+"']").attr("selected",true);
    });
});

これがスクリーンショットです。中央のアイコンを押すと、ここでは何も変更されませんが、コード自体のみが変更されます。アイコンを押すと、米ドルは「from」に、inrは「to」に表示されます。

スクリーンショット

jsfiddle.netの例

4

3 に答える 3

2

selectmenu （）関数には、値を変更する独自の方法があることがわかりました。
ここで動作するバージョンを確認してください：http：//jsfiddle.net/atR6D/55/

$('#switchButton').click(function(){
    var sel1 = $('#fromCurrency').selectmenu("value");
    var sel2 = $('#toCurrency').selectmenu("value");
    $('#fromCurrency').selectmenu("value", sel2);
    $('#toCurrency').selectmenu("value", sel1);
});

タグで選択リストを表現しているように見える<span>ため、元の選択リストを実際に変更することはできません。

于 2012-01-30T12:34:16.390 に答える
1 
 $(function(){
    $('#switchButton').click(function(){
        var $sel1 = $('#fromCurrency');
        var $sel2 = $('#toCurrency');

        var tmp = $sel2.val();
        $sel2.val($sel1.val());
        $sel1.val(tmp);

    });
});

そして、これがデモです。

于 2012-01-30T09:46:21.403 に答える
1

http://wiki.jqueryui.com/w/page/12138056/Selectmenuから：

Methods:
   refresh
       parses the original element again, updates the value option and
       rerenders the menu triggers events if value changed

したがって、基になるselectに変更を加えた後、それを追加するだけです。

$(function(){
    $('a#switchButton').click(function(){
        var $sel1 = $('#fromCurrency');
        var val1 = $sel1.val();
        var $sel2 = $('#toCurrency');
        var val2 = $sel2.val();
        $sel1.find("option[value='"+val1+"']").attr("selected",false);
        $sel1.find("option[value='"+val2+"']").attr("selected",true);
        $sel2.find("option[value='"+val2+"']").attr("selected",false);
        $sel2.find("option[value='"+val1+"']").attr("selected",true);

        $sel1.selectmenu('refresh');
        $sel2.selectmenu('refresh');

        return false;
    });
});
于 2012-01-30T10:12:03.360 に答える