0

次の問題があります。

4つのチェックボックス（ランチ、ダイナー、ミート、レスト）、1つの入力フィールド（地名）、[次のページに移動]ボタンを含む（htmlとjavascript）で作成されたページがあります。これらのチェックボックスと入力フィールドはすべてオプションであり、空白のままにすることも選択しないこともできます。

ボタンをクリックして次のページに移動すると、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

今のところこのコードを書いています。ステートメント数を2つに制限します。足りないものがあれば追加します。

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 という 4 つのチェックボックスがあるとします。次に、これらのビットを作成することで解決できます..たとえば、A = 0 または 1 B = 0 または 1 など..次に、これらのビットを互いに組み合わせると、ABCD がすべて偽であることを意味する 0000 のようになります。または 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 に答える