1

我有这个从我的数据库中获取数据的选择框。我想要做的是在我的选择框旁边添加编辑和删除按钮,这些按钮将对当前选定的选项执行相应的操作。

所以我添加了两个按钮,它们直接指向完成所有这些工作的 php 脚本。我的问题是 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从中删除内联。

更新了小提琴

在您最初的小提琴中,您没有选择适当的框架属性。

请注意,我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 回答