如何勾選頁面加載使用JavaScript的複選框？

<input type="hidden" id="amenities" value="@Model.Amenities" /> 

    <script type="text/javascript"> 

$(function() { 


    arr = new Array(); 

    var str = document.getElementById("amenities").value; 

    arr = str.split(","); 

    for(count =0;count<arr.length;count++) 
    { 
     $("input[type=checkbox][value=arr[count]]").prop("checked",true); 
    } 
    </script>

在模型中有一個屬性稱爲「設施」類型的字符串。它存儲所有的設施，如WiFi，游泳池，公園等與分隔符（，）。當我進入編輯頁面時，我希望檢查所有這些設施是否被早先存儲用於該特定屬性。如何勾選頁面加載使用JavaScript的複選框？

來源

2014-08-28 Smoking monkey

你爲什麼不檢查它在服務器上生成的頁面時？我的意思是你有這些數據，你把它作爲隱藏字段的值，以稍後檢查與JavaScript的複選框以昏迷分隔的字符串？重點是什麼？ – 2014-08-28 06:26:52

我試過了你的東西。我把它改成了一個文本框，它顯示了所有的設施。但是我想勾選那些值在@ Model.Amenities中出現的複選框。 – 2014-08-28 06:30:43

我建議在生成視圖時在服務器上執行此操作。所有你需要的是：

public class MyModel 
{ 
... 
    public string[] Amenities { get; set; } 
... 
}

然後在視圖：

@Html.Checkbox("WiFi", @Model.Amenities.Contains("WiFi")) 
@Html.Checkbox("Pool", @Model.Amenities.Contains("Pool"))

當然這只是一個例子，在現實生活中，你可能有可能設施的服務，您遍歷渲染每個選項的複選框。而不是字符串作爲值我會推薦和枚舉。

來源

2014-08-28 06:54:37

我沒有使用字符串數組，但仍然使用類型'字符串'而不需要任何分割腳本。使用數組有什麼特別的理由嗎？ – 2014-08-28 07:05:30

那麼，一般來說，如果你必須存儲幾件東西，那麼你通常將它們存儲在數組，列表，字典，散列表等。字符串用於文本數據。當你用逗號分隔的字符串存儲你的項目時，你會有幾個含義：'String.Contains（）'與'IEnumerable.Contains'不同。 ''停車'.Contains（「park」）== true'。同時在字符串中搜索子字符串與檢查給定項目是否在列表/數組/散列表中是完全不同的操作。 – 2014-08-28 07:45:13

<script type="text/javascript"> 
    $(function() { 
     var arr = new Array(); 
     var str = $("#amenities").val(); 
     arr = str.split(","); 
     $('input[type=checkbox]').each(function(key,val){ 
      if(jQuery.inArray($(this).val(), arr){ 
       $(this).prop("checked",true); 
      } 
     }) 
    }); 
</script>

檢查上面的代碼。

一個建議，因爲您使用的是jQuery，所以使用jQuery語法。

來源

2014-08-28 06:34:24

兄我試過你的東西，但它沒有奏效。感謝您的建議。 – 2014-08-28 07:03:40

這工作：

<script type="text/javascript"> 
    $(document).ready(function(){ 
     var arr = $("#amenities").val().split(","); 
     $('input[type=checkbox]').each(function(){ 
      if($.inArray($(this).val(), arr) >= 0){ 
      $(this).attr("checked",true); 
      } 
     }); 
    }); 
</script>

來源

2014-08-28 06:58:27

是的，這很好。由於我使用MVC，我更喜歡使用@html元素。儘管我已在註釋中保存了您的代碼。謝謝。 – 2014-08-28 07:27:58

如何勾選頁面加載使用JavaScript的複選框？

回答

相關問題