0

我有以下问题。

我有一个使用（html 和 javascript）构建的页面，其中包含 4 个复选框（午餐、晚餐、会议、休息）、一个输入字段（地名）和一个转到下一页按钮。这些复选框和输入字段都是可选的，也可以留空/未选中​​。

如果我单击按钮并转到下一页，将会有一个从 javascript 生成的来自硬编码 json 的列表：

var myData = [ {
                 "Name" : "Bla",
                 "Placename" : "Amsterdam",
                 "lunch" : "true"
               },
               {
                 "Name" : "Bla2",
                 "Placename" : "Paris", 
                 "lunch" : "false",
                 "diner" : "true"
               },
               {
                 "Name" : "Bla3",
                 "Placename" : "London",
                 "meet" : "false",
                 "diner" : "true"
               },
               {
                 "Name" : "Bla4",
                 "Placename" : "Berlin"
               }];

现在的想法是我检查选择了哪个复选框和/或插入了一个地名我这样做如下：

 if(placename == ""){ 
    check json without checking placename..
 }else{
   if( ((lunchCheckbox == checked) && (element.lunch == "true")) && (Placename == element.Place)){ }

但是这里的问题是现在会有很多 if 语句，有没有办法更好地做到这一点（用更少的语句）..

我想过一个循环，但想知道是否有更好的方法

4

3 回答 3

0

我暂时写下这段代码。我将语句数限制为两个。如果缺少一些东西，我会添加它。

HTML：

<div class="form">
  Lunch : <input type="checkbox" id="lunch" class="detail"/>
  Diner : <input type="checkbox" id="diner" class="detail"/>
  Meet : <input type="checkbox" id="meet" class="detail"/>
  Rest : <input type="checkbox" id="rest" class="detail"/>
  </br>
  Placename : <input type="text" id="placename" class="detail"/>
  </br></br>
  <button id="next">next</button>
  </br></br>
  response
  </br>
  <textarea rows="30" cols="30" id="response"></textarea>
</div>

JS：

$(document).ready(function(){
    $("#next").click(function(){
        var json = {};

        $("input.detail").each(function(index, element){
          var el = $(element);

          if(el.attr("type") == "checkbox")
            json[el.attr("id")] = el.is(":checked");
          else if( el.attr("type") == "text" && el.val() != "")
              json[el.attr("id")] = el.val();
        });

        $("#response").val( JSON.stringify(json, undefined, 2) );
    });
});

这里有一个 Jsfiddle 示例。

于 2012-09-25T08:41:59.393 回答
0

是的，您可以对所有这些条件使用循环。但是，您仍然需要在数组或类似的情况下使用这些条件，因此如果您不能以编程方式构建它们，则对您当前的代码没有任何影响。请描述一种编程方式，以便我向您展示一些示例代码。

于 2012-09-25T08:47:28.207 回答
0

我认为这将解决问题：

例如，如果您有四个名为：A、B、C、D 的复选框。然后一个解决方案是制作这些位.. 例如 A = 0 或 1 B = 0 或 1 等等.. 然后将这些位相互组合，然后你得到像 0000 这意味着 ABCD 都是错误的，或者 0001只有 D 是真的。之后，您可以将其保存为像 TotalBits = "0000" 这样的字符串。然后你也可以使用 json 参数 lunch="true" = 1 来执行此操作，并将总位数保存在 TotalBits2 中，例如，最后检查这些位是否相同，然后就可以了 :)

因此，例如，如果您对其进行编码...

var aBit;
var bBit;
var cBit;
var dBit;

if(a == true){aBit="1"};
if(b == true){bBit="1"};
if(c == true){cBit="1"};
if(d == true){dBit="1"};

var totalBits1 = a+b+c+d; //which results in "1111"

然后午餐也一样，例如：

 var lunchBit;
 if(element.lunch == "true"){ lunchBit="1";};
 etcetera..

 var totalBits2 = lunchbit+dinerbit+.....; //which results in for example 1000..

最后检查是否 totalBits1 == totalBits2 然后产生结果..

于 2012-09-26T08:49:14.257 回答