2012-08-12 90 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");});