htmlの選択ボックスでプログラム的な変更を検出する

プログラムの選択が変更されるたびに、HTML select要素の呼び出しを関数にする方法はありますか？htmlの選択ボックスでプログラム的な変更を検出する

選択ボックス内の現在の選択がjavascriptで変更されている場合、IEとFFの両方で 'onchange'が発生しません。さらに、選択を変更するjs関数はフレームワークの一部なので、たとえば、最後にonchange（）をトリガーするように変更することはできません。

はここに例を示します

<body> 
<p> 
<select id="sel1" onchange="myfunction();"><option value="v1">n1</option></select> 
<input type="button" onclick="test();" value="Add an option and select it." /> 
</p> 
<script type="text/javascript"> 
    var inc = 1; 
    var sel = document.getElementById('sel1'); 
    function test() { 
     inc++; 
     var o = new Option('n'+inc, inc); 
     sel.options[sel.options.length] = o; 
     o.selected = true; 
     sel.selectedIndex = sel.options.length - 1; 
    } 

    function myfunction() { 
     document.title += '[CHANGED]'; 
    } 
</script> 
</body>

はテスト（）を変更（またはボタンにイベントを追加）せずにテスト（）呼び出しのMyFunctionを（）にする方法はありますか？

ありがとうございました。

出典

2009-08-02 Anonymous

のonchangeイベントではなく手段を変更しましたユーザーが選択を変更したことを示し、オプションが変更されていないことを示します。 – Gumbo

フレームワークを拡張/変更して、選択オプションを変更したときにフック/コールバックを与えることができれば、より良いでしょう（jsの動的機能を使用してダックタイプにすることができますか？

これに失敗すると、ポーリングという非効率的な解決方法があります。希望の選択肢dom要素をポーリングするsetTimeout/setInteval呼び出しを設定し、何かが変更されたことを検出したときに自分のコールバックを起動することができます。あなたの質問

への回答のためとして

はテスト（）（またはボタンのイベントを追加）を変更せずにテストを（）（のMyFunctionを呼び出す）を作成する方法はありますか？

はい、jquery AOP http://plugins.jquery.com/project/AOPを使用すると、簡単な解決策が得られます。

<body> 
<p> 
<select id="sel1" onchange="myfunction();"><option value="v1">n1</option></select> 
<input type="button" onclick="test();" value="Add an option and select it." /> 
</p> 
<script type="text/javascript"> 
    var inc = 1; 
    var sel = document.getElementById('sel1'); 
    function test() { 
     inc++; 
     var o = new Option('n'+inc, inc); 
     sel.options[sel.options.length] = o; 
     o.selected = true; 
     sel.selectedIndex = sel.options.length - 1; 
    } 

    function myfunction() { 
     document.title += '[CHANGED]'; 
    } 

    //change to aop.after if you want to call afterwards  
     jQuery.aop.before({target: window, method: 'test'}, 
     function() { 
      myfunctino(); 
     } 
    ); 
</script> 
</body>

出典

2009-08-02 14:48:52 Chii

私も第2の選択肢について考えましたが、これが私の最後の手段であるならば、私はタイマーを使うだけです。最初のソリューションはいいと思うが、ソースコードを変更せずにテストを拡張/フックするにはどうすればよいだろうか？ –

+1。ポーリングは考慮する価値のあるオプションです。ただし、変更時に呼び出すコードは、変更と同期して実行されないことに同意する必要があります。 – AnthonyWJones

jQuery.aopソリューションは、魅力的に機能します。どうもありがとう！ –

答えがいいです。

DOMは、コードではなくユーザーアクションの結果としてonchangeイベントのみを発生させます。この点については、追加のイベントはありません。

フレームワークをカスタマイズするか、要件を削除する必要があります。

出典

2009-08-02 14:54:06 AnthonyWJones

エヘン...

あなたはそれが変更されたプロパティを識別するためにイベント引数内プロパティが含まれている「onpropertychange」イベントにアクセスすることができます。

これは、両方の「selectedIndexの」と「価値」の変化を検出する - 私は現在、ここにASP.NET JSフレームワークで働いているだけでケースのテスト「propertyNameの」をそのためのいくつかのストレートのコピー＆ペーストのコードです：

1）ハンドラを定義します。

this._selectionChangedHandler = null;

2）ハンドラ

this._selectionChangedHandler = Function.createDelegate（これ、これを割り当てます。_onSelectionChanged）;

3）は、イベント

$はaddHandler（要素、 "にPropertyChange"、this._selectionChangedHandler）にハンドラをアタッチ。

4）

_onSelectionChanged: function(ev) { 

if (ev.rawEvent.propertyName == "selectedIndex") 
     alert('selection changed'); 
},

出典

2009-09-07 22:14:05

は、フレームワークの機能を呼び出して、コールバック関数を呼び出して、独自の変更関数を定義関数を作成します。

は、例えば：jQueryを使って

function change(callback) 
{ 
    frameworkchange(); 
    callback(); 
}

出典

2011-05-01 15:00:51 Sam

は、あなたがこれをプログラムで変更を検出し、各項目に対応させます

$(document).ready(function(){ 

      $('#select-id').change(function(e){ 
       e.preventDefault(); 
       //get the value of the option selected using 'this' 
       var option_val = $(this).val(); 

        if(option_val == "v1"){ 
         //run your function here 
        } 
       return true; 
      }); 
    });

ような何かを行うことができ

出典

2014-03-20 05:21:49 Nlinscott

htmlの選択ボックスでプログラム的な変更を検出する

答えて

関連する問題