3

これがサンプルhttp://jsfiddle.net/HhXGH/57/です。

jqueryでラジオボタンをクリックしていますが、knockout.jsはそれを認識しません。それでも最初にクリックした値が表示されます。

<p>Send me spam: <input type="checkbox" data-bind="checked: wantsSpam" /></p>
<div data-bind="visible: wantsSpam">
    Preferred flavor of spam:
    <div><input type="radio" name="flavorGroup" value="cherry" data-bind="checked: spamFlavor" /> Cherry</div>
    <div><input type="radio" name="flavorGroup" value="almond" data-bind="checked: spamFlavor" /> Almond</div>
    <div><input type="radio" name="flavorGroup" value="msg" data-bind="checked: spamFlavor" /> Monosodium Glutamate</div>
</div>


var viewModel = {
        wantsSpam: ko.observable(true),
        spamFlavor: ko.observable('cherry')
    };

ko.applyBindings(viewModel);

$(':radio:last').click();

alert(viewModel.spamFlavor())
4

3 に答える 3

4

これは、チェックされたラジオ/チェックボックス要素のみのクリック イベントを Knockout がサブスクライブしているためです。チェックアウトのバインディング ハンドラー コードをチェックアウトした場合。これを行います。

var updateHandler = function() {
            var valueToWrite;
            if (element.type == "checkbox") {
                valueToWrite = element.checked;
            } else if ((element.type == "radio") && (element.checked)) {
                valueToWrite = element.value;
            } else {
                return; // "checked" binding only 
                responds to checkboxes and selected radio buttons
            }

したがって、コードを機能させるには、これを実行します。

$(':radio:last').prop('checked', true).click();

ただし、最後の値を確認することが目標である場合は、

viewModel.spamFlavor("msg");

これにより、同じ結果が得られます。

お役に立てれば。

于 2012-05-26T20:34:50.407 に答える
1

クリックのトリガーに加えて追加$(':radio:last').attr('checked', true);すると、私にとってはうまくいきます:

http://jsfiddle.net/jearles/HhXGH/61/

于 2012-05-26T20:21:46.390 に答える
0

私は2 つの異なる jsFiddlesを持っています。

最初の jsFiddle、最後のラジオ ボタンが手動でクリックされると、アラートを介して応答します。

2 番目のjsFiddle 、アラートなしで投稿された/57/ jsFiddle です。

関数でalert または console.logを使用すると、実際にその関数が呼び出されますとはいえ、最後のラジオ ボタンに手動で設定した後、それがデフォルト値であるため、うっかりリセットされてしまいます。.click()cherry

再編集: 2 番目のjsFiddleには、関数を呼び出さない構文で記述されたアラートが含まれるようになり、短縮されたマークアップが使用されるようになりました。

于 2012-05-26T20:12:19.200 に答える