Javascript:通过选项元素和 "onchange"传递数据

Question

我有一个由 PHP 文件填充的“选择”元素。输出是包含名称、地址、城市、州等的位置列表。我想这样做，以便在更改此下拉列表时将新地址加载到地址表单中。

这是我想要开始工作的代码，它可能会更好地解释这一点:

<select name='address' id='address'>
    <option value='0' onselect='clearAddress()'></option>
    <option value='1' onselect='loadAddress("1 Main St", "New York")'>Mark's House</option>
    <option value='2' onselect='loadAddress("5 Arc Rd", "Orlando")'>Bob's Apt</option>
    <option value='3' onselect='loadAddress("2 Fox Ln", "Clinton")'>Joe's Bar</option>
</select>

我知道 onselect 在这里不起作用，虽然向 select 元素添加“onchange”可能起作用，但我看不到它对各个选项的作用。

关于如何做到这一点有什么想法吗？谢谢!

Answer 1

可能不是一个合适的解决方案，但你可以通过

<select name='address' id='address' onchange="doCall(this)">
    <option value='0' data-load=''></option>
    <option value='1' data-load='1 Main St,New York'>Mark's House</option>
    <option value='2' data-load='5 Arc Rd,Orlando'>Bob's Apt</option>
    <option value='3' data-load='2 Fox Ln,Clinton'>Joe's Bar</option>
</select>

和

function doCall(elt) {

   var params = elt.options[elt.selectedIndex].getAttribute("data-load").split(",");

   alert(params[0]);
   alert(params[1]); 

}

这里是 a fiddle .