我有一个包含多种输入类型的搜索表单,我想在用户对输入进行更改时从搜索表单中获取值。
表格是这样的:
<form id="search">
<input type="hidden" name="cat[0][name]" value="cat1">
//select type input.
<select id="cat-0" name="cat[0][id]" >
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
<input type="hidden" name="cat[1][name]" value="cat2">
<select id="cat-1" name="cat[1][id]" >
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
//checkbox type input
<input type="hidden" name="cat[2][name]" value="cat3">
<label><input id="cat-2" type="checkbox" name="cat[2][id][]" value="1"> 1</label>
<label><input id="cat-2" type="checkbox" name="cat[2][id][]" value="2"> 2</label>
<label><input id="cat-2" type="checkbox" name="cat[2][id][]" value="3"> 3</label>
//radio type input
<input type="hidden" name="cat[3][name]" value="cat4">
<label><input id="cat-3" type="radio" name="cat[3][id]" value="1"> 1</label>
<label><input id="cat-3" type="radio" name="cat[3][id]" value="2"> 2</label>
<label><input id="cat-3" type="radio" name="cat[3][id]" value="3"> 3</label>
</form>
正如您所看到的,输入值是多维数组。当用户对其中一个输入进行更改时,如何通过javascript获取这些值。我想做的就是创建一个像site这样的搜索引擎。
表单是动态生成的,因此我无法为每个字段定义固定的id / class。
js脚本应该是这样的吗?
$('[id^=cat]').live('change', function(e) {
passing_data();
return false;
});
function passing_data() {
var getdata = $(':input[name="cat"]').val();//this i can't get it.
alert(getdata);
return false;
}
passing_data()是我没有得到的部分,它将在ajax中用于执行搜索功能。
有什么想法吗?
答案 0 :(得分:1)
尝试将“this”传递给函数:
$('[id^=cat]').live('change', function(e) {
passing_data($(this)); // pass object as a jQuery object
return false;
});
function passing_data($obj) {
var getdata = $obj.val();
alert(getdata);
return false;
}
答案 1 :(得分:0)
legendinmaking和JohnMarkT给出的答案都可以解决我的问题。真的很感谢你的答案。它对我很有帮助。
对我来说,最终的解决方案是结合这两个答案,如下:
$('[id^=cat]').live('change', function(e) {
passing_data($(this)); // pass object as a jQuery object
return false;
});
function passing_data($obj) {
var getdata = $obj.closest("form").serialize();// i have multiple form,so it should choose the responding form.
alert(getdata);
return false;
}