Question

如何将.delegate方法应用于此jquery行？

$(function() {
    $("input[type='checkbox']").on('change', function() {
        if (this.checked) {
            $(".loadingItems").fadeIn(300);
            var color = encodeURI(this.value);
            $(".indexMain").load('indexMain.php?color=' + color, function() {
                $(".indexMain").fadeIn(slow);
            });
            $(".loadingItems").fadeOut(300);
        } else {
            $(".loadingItems").fadeIn(300);
            $(".indexMain").load('indexMain.php', function() {
                $(".loadingItems").fadeOut(300);
            });
        }
    });
});

形式：

echo "<input type='checkbox' class='regularCheckbox' name='color[]' value='".$colorBoxes[color_base1]."' /><font class='similarItemsText'>   ".$colorBoxes[color_base1]."</font><br />";

PHP接收颜色：

$color = $_GET['color'];
$items = $con -> prepare("SELECT * FROM item_descr WHERE color_base1 = :colorbase1");
        $items -> bindValue(":colorbase1", $color);
while($info = $items->fetch(PDO::FETCH_ASSOC)) 
{ ....

我需要在复选框设置中允许多项选择。

Answer 1

既然您已经向我们展示了您真正要做的事情，那么您必须更改代码的工作方式，.delegate()对解决该问题没有用处。

现在，在构建将与indexMain.php一起使用的网址时，您只检查了一个复选框的值。相反，您需要在构造该URL时检查所有已选中复选框的值。

当选中多个复选框时，您没有说明如何构建URL，但从结构上来说代码将是这样的：

$(function() {
    $("input[type='checkbox']").on('change', function() {
        var colors = [];
        $("input[type='checkbox']:checked").each(function() {
            colors.push(this.value);
        });
        if (colors.length) {
            $(".loadingItems").fadeIn(300);
            $(".indexMain").load('indexMain.php?color=' + colors.join("+"), function() {
                $(".indexMain").fadeIn(slow);
            });
            $(".loadingItems").fadeOut(300);
        } else {
            $(".loadingItems").fadeIn(300);
            $(".indexMain").load('indexMain.php', function() {
                $(".loadingItems").fadeOut(300);
            });
        }
    });
});

当选择一种或多种颜色时，此代码将生成.load()命令的URL：

indexMain.php?color=blue+yellow+green+orange

如果没有选择颜色，它将调用indexMain.php而没有其他参数。

您的服务器代码将解析URL中的颜色并创建所需的响应。

Answer 2

$(document).on('change', 'input[type=checkbox]', function() {
   // code
});

使用jQuery .on() ，您可以这样做。

.on()的语法：

$(static_parent).on( eventName, target, handlerFunction);

其中static_parent表示target的非动态容器，target是绑定事件的元素。

Answer 3

代表可以写成如下

$("table").delegate("td", "click", function(){$(this).toggleClass("chosen");});

使用最新的（可从jquery 1.7获得）on（），如下面的

，可以实现同样的目的

$("table").on("click", "td", function(){$(this).toggleClass("chosen");});

Jquery委托方法应用程序

3 个答案: