1

DB からデータを取得するこの選択ボックスがあります。私がやりたいことは、現在選択されているオプションに対してそれぞれのアクションを実行する選択ボックスの横に、[編集] ボタンと [削除] ボタンを追加することです。

そこで、このすべての作業を行う php スクリプトに直接アクセスする 2 つのボタンを追加しました。私の問題は、ボタンの要素を更新する必要がある JavaScript にあります。

ただし、私の JS 関数は機能しません。解雇すらされていないようです。

http://jsfiddle.net/y5g42/33/

HTML:

<select name='selectHotel' onChange='updateButtons(this.options[this.selectedIndex].text)'>
    <option value="volvo.php">Volvo</option>
    <option value="saab.php">Saab</option>
    <option value="mercedes.php">Mercedes</option>
    <option value="audi.php">Audi</option>
</select>
<a href='' id='editButton'><button>Edit</button></a>
<a href='' id='deleteButton'><button>Delete</button></a>

JavaScript:

function updateButtons(var) {
    element = document.getElementById('editButton');
    element.href = var;
}​
4

4 に答える 4

2

var変数名として使用することはできませんvar-javascriptsの予約語です。

于 2012-04-30T12:41:54.857 に答える
1

jsFiddleのonLoadオプションは、コードをコールバック関数でラップします。
したがって、関数定義はコードの外部には表示されません。

No Wrap代わりに選択する必要があります。

于 2012-04-30T12:41:02.317 に答える
1

ロジックとフィドル自体にいくつかの問題があります。

JavaScript ライブラリを使用しない最善の方法は、ウィンドウの にonchangeハンドラーをアタッチし、そこですべてを処理することです。onload

window.onload = function() {
    var oDDL = document.getElementById("selectHotel");

    oDDL.onchange = function updateButtons() {
        var oLink = document.getElementById('editButton');    
        oLink.href = oDDL.value;
    };

    oDDL.onchange();
};

機能させるには、要素に追加id="selectHotel"し<select>、インラインを削除しonchangeます。

フィドルを更新しました。

最初のフィドルでは、適切なフレームワーク プロパティを選択しませんでした。

選択した値を反映するために手動で を 1 回呼び出していることに注意してくださいonchange。そうしないと、他の値を選択する前にボタンをクリックしても機能しません。

于 2012-04-30T12:58:20.683 に答える
0

onchange関数にテキストではなく値を渡しました

  onChange='updateButtons(this.options[this.selectedIndex].value)'

次のようなものを試すことができます：

 window.updateButtons = function(value) {

     element = document.getElementById('editButton');
     var url = window.location.href;
     element.href = url + value;
     console.log(element.href);  
}

デモを参照してください : http://jsfiddle.net/y5g42/46/

于 2012-04-30T12:59:00.217 に答える