Question

您好我会尽可能清楚地尝试解释。我正在尝试使用多个复选框添加过滤器产品，用户可以单击该复选框，这将改变我的php mysql查询。

我在网上看过一些这样的例子，但他们只是展示和隐藏div。我想取复选框的值，然后单击并在查询中动态插入它们。

所以我的问题是如何在不使用表单的情况下从多个复选框传递值？

<div id="filterContentTitle">Filter Results</div>
        <div id="filterContentResults">
         <div id="filterContentCat">Categories</div>
         <input type='checkbox' name='categories' value='1'  /><label for='categories'>Dishwashers</label><br /><input type='checkbox' name='categories' value='2'  /><label for='categories'>Hoods</label><br /><input type='checkbox' name='categories' value='3'  /><label for='categories'>Microwaves</label><br /><input type='checkbox' name='categories' value='4'  /><label for='categories'>Refrigerators</label><br /><input type='checkbox' name='categories' value='5'  /><label for='categories'>Stoves & Ranges</label><br /><input type='checkbox' name='categories' value='6'  /><label for='categories'>Washers & Dryers</label><br />         </div>
        <hr />
        <div id="filterContentResults">
         <div id="filterContentCat">Brands</div>
         <input type='checkbox' name='brand[]' value='GE' /><label for='brand'>GE</label><br /><input type='checkbox' name='brand[]' value='Viking' /><label for='brand'>Viking</label><br /><input type='checkbox' name='brand[]' value='Whirlpool' /><label for='brand'>Whirlpool</label><br />           </div>
        <hr />
        <div id="filterContentResults">
         <div id="filterContentCat">Refrigerators Type</div>
         <input type='checkbox' name='subCategory[]' value='French Door'><label for='subCategory'>French Door</label><br /><input type='checkbox' name='subCategory[]' value='Bult-In'><label for='subCategory'>Bult-In</label><br /><input type='checkbox' name='subCategory[]' value='Side by Side'><label for='subCategory'>Side by Side</label><br />           </div>
        <hr />
        <div id="filterContentResults">
         <div id="filterContentCat">Refrigerators Capacity</div>
         <input type='checkbox' name='capacity[]' value='20.7 cu ft'><label for='capacity'>20.7 cu ft</label><br /><input type='checkbox' name='capacity[]' value='28.6 cu ft'><label for='capacity'>28.6 cu ft</label><br /><input type='checkbox' name='capacity[]' value='20.4 cu ft'><label for='capacity'>20.4 cu ft</label><br /><input type='checkbox' name='capacity[]' value='24.6 Cu. Ft.'><label for='capacity'>24.6 Cu. Ft.</label><br /><input type='checkbox' name='capacity[]' value='25 cu. ft.'><label for='capacity'>25 cu. ft.</label><br /><input type='checkbox' name='capacity[]' value='22.0 Cu. Ft.'><label for='capacity'>22.0 Cu. Ft.</label><br />           </div>
        <hr />
        <div id="filterContentResults">
         <div id="filterContentCat">Condition</div>
         <input type='checkbox' name='condition[]' value='New'><label for='condition'>New</label><br />         </div>
        <hr />
        <div id="filterContentResults">
         <div id="filterContentCat">Color</div>
         <input type='checkbox' name='color[]' value='Stainless Steel'><label for='color'>Stainless Steel</label><br /><input type='checkbox' name='color[]' value='Black'><label for='color'>Black</label><br /><input type='checkbox' name='color[]' value='Biscuit'><label for='color'>Biscuit</label><br />         </div>

Answer 1

您可以做的是绑定到input上的jQuery change事件。

当输入被更改时，您可以将正在发送的查询（可能是使用Ajax）更新到PHP脚本

$("input").change(function() {
    updateProductList($(this).attr("id"), $(this).prop("checked"));
});

function updateProductList(field, state) {
    // Do Work
    $.ajax({
        source: "my-url.php?" + field + "=" + state
    });
}

注意：这个例子很简单，但希望你能理解。

需要帮助从没有表单的复选框中保存值

1 个答案: