Question

我有以下HTML代码：

<select name = 'category' id='category'>
    <option value="a">A <a href="" class = "edit" id ='1'> Click here to edit </a> </option>
    <option value="b">B <a href="" class = "edit" id ='b'> Click here to edit </a> </option>
</select>

我这样想：

$(document).on('click','.edit', editfunction);

function editfunction() {
    alert('hi');
    //call here ajax code 
}

Answer 1

首先你的HTML无效;您不能在a：

中包含option个元素

<select name="category" id="category">
    <option value="a">A</option>
    <option value="b">B</option>
</select>

要执行您的要求，您可以加入change的{{1}}事件，而不是select中click的{{1}}。然后，您可以使用a在option中获取所选值：

$(this).val()

Answer 2

尝试使用以下

$('#category').on('change', function(){
   editfunction( $(this).val() );
 })

function editfunction(val){
   // Make your ajax call here
}

而你实际上并不需要内部的标签来实现这一目标

I think this is what u want JSFIDDLE example

如何在下拉列表中调用javascript或jquery函数

2 个答案: