2012-08-12 96 views
-1

如何将.delegate方法应用于此行的jquery?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)) 
{ .... 

我需要允许设置一个复选框多项选择。

+3

你试图解决你目前的代码没有解决什么问题?你为什么要使用'.delegate()'? – jfriend00 2012-08-12 19:33:58

+0

试图允许多选...当前选择复选框时我得到我的第一个内容,然后检查另一个框不结合框的结果1和2 ...只显示2 – samyb8 2012-08-12 21:16:39

+0

你必须告诉我们代码在您的更改处理程序。这显然是问题所在。 – jfriend00 2012-08-12 21:20:04

回答

1

现在你已经证明可以实现同样的事情我们稍微了解一下你真正想做的事情,你将不得不改变你的代码的工作方式,并且.delegate()对于解决这个问题是没有用的。

现在,在构建您将与indexMain.php一起使用的URL时,您正在检查仅一个复选框的值。相反,您需要在构建该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); 
      }); 
     } 
    }); 
}); 

此代码将产生的URL,​​命令状这当一种或多种颜色选择:

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

如果没有选择的颜色,它会调用indexMain.php没有其他参数。

这将取决于您的服务器代码来解析URL的颜色并创建所需的响应。

+0

你确定这可以吗?不适合我... – samyb8 2012-08-12 21:47:54

+0

@ user1545622 - 你真的在问这个问题吗?这是一个你必须填写你自己的构建URL的逻辑的结构。您尚未向我们提供足够的信息,以了解如何根据多个复选框的值构建'indexMain.php'的URL。根据您提供的信息,这是我们可以提供的最多的信息。如果您想完整描述您尝试解决的问题,包括您正在使用的HTML以及您尝试生成的URL规范,我们可能会提供更多帮助。在此之前,这是我们能做的。 – jfriend00 2012-08-12 22:20:50

+0

我编辑了原始文章的更多详细信息,以防您可以看一看...谢谢! – samyb8 2012-08-13 13:00:55

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

使用jQuery .on()你可以做到这一点。

语法的.on()

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

static_parent装置的targettarget非动态容器是结合事件(一个或多个)的元素。

+0

但是,如何在这里添加.delegate? – samyb8 2012-08-12 20:51:51

0

代表可写为下面

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

,并可以使用最新的(可从jQuery的1.7)上()像下面

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