-1

您好，制作了一个实时过滤器功能，但在发送来自不同类的复选框值时遇到问题：

<input type="checkbox" onclick="return test();" class="type" name="type1" value="1"  /> Trousers <br />
<input type="checkbox" onclick="return test();" class="type" name="type3" value="3"  /> T-shirts <br />
<input type="checkbox" onclick="return test();" class="type" name="type2" value="2"  /> Jackets <br />

<input type="checkbox" onclick="return test();" class="color" name="color1" value="1"  /> Red <br />
<input type="checkbox" onclick="return test();" class="color" name="color3" value="3"  /> Blue <br />
<input type="checkbox" onclick="return test();" class="color" name="color2" value="2"  /> Green <br />

使用此代码，我可以从所有复选框中动态获取值：

function test() {
    var counter = 0, 
        i = 0,       
        url = 'items.php?',    
        input_obj = $('input[type=checkbox]');


    for (i = 0; i < input_obj.length; i++) {
        if (input_obj[i].type === 'checkbox' && input_obj[i].checked === true) {
            counter++;
            url = url + '&a=' + input_obj[i].value;
        }
    }
    if (counter > 0) {
        alert(url);

    }
}

但我需要不同的类具有不同的 url 名称(type - &a=value, color - &b=value)并将所有这些组合到一个 url。

4

2 回答 2

3

通过为复选框赋予相同的名称（因为您使用的是 PHP，以该名称结尾[]）而不是使用类来对复选框进行分组。然后用于serialize为您的 Ajax 请求生成编码数据。

例如：_

<form>

<label><input type="checkbox" name="type[]" value="1"  /> Trousers </label>
<label><input type="checkbox" name="type[]" value="3"  /> T-shirts </label>
<label><input type="checkbox" name="type[]" value="2"  /> Jackets </label>

<label><input type="checkbox" name="color[]" value="1"  /> Red </label>
<label><input type="checkbox" name="color[]" value="3"  /> Blue </label>
<label><input type="checkbox" name="color[]" value="2"  /> Green </label>

</form>

​和

$('input[type=checkbox]').on('click', function () {
    alert($(this.form).serialize());
});​
于 2012-07-19T11:36:39.740 回答
0

花了一段时间才明白你想表达什么......

我猜您想将复选框的当前状态发送到一个 url，很可能在选择某个复选框后立即发送。

我真的不明白该机制如何与所有 onclick 一起工作......我建议你重组你的代码：

从您的输入复选框中删除这些 onclick 定义，而是将您的 test() 例程绑定到单击复选框时引发的 javascript 事件。使用像 jQuery 这样的 javascript 库使这更方便。使用不同的 jQuery 选择器进行绑定，您可以对不同的事件有不同的反应，例如按选中的复选框的类进行过滤。

$('input.type').on('click',function(e){test('type',e);});
$('input.color').on('click',function(e){test('color',e);});

或者，您可以使用单个绑定并评估作为参数“e”传递的事件。您可以使用它来读取已单击元素的类。

希望这可以帮助。否则，请尝试更清楚地说明您真正想要发生的事情。您的目标不是“不同的类有不同的 url 名称”，而是应该将复选框值发送到不同的 url，或者应该将浏览器转发到不同的 url，具体取决于...

于 2012-07-19T11:41:44.600 回答