Question

我在不同的侧菜单下有不同名称的复选框，但在每个侧菜单下都有相同的名称。例如：

<?php for($i=0; $i<=5; $i++){?>
    <input type="checkbox" name="second[]" value="<?php echo $i + 10;?>" id="<?php echo $i;?>"><?php echo $i+10;?><br>
<?php } 

    for($j=123; $j<=129; $j++){?>
    <input type="checkbox" name="third[]" value="<?php echo $j+10;?>" id="<?php echo $j;?>"><?php echo $j+10;?><br>
    <?php } ?>

    for($k=223; $k<=259; $k++){?>
    <input type="checkbox" name="fourth[]" value="<?php echo $k + 10;?>" id="<?php echo $k;?>"><?php echo $k+10;?><br>
    <?php } ?>

我希望以字符串形式获取URL中已选中复选框的值，并在检查后在各自的名称后打印其值。

网址应该是：http://something.com/?name1=value1+value2+value3&name2=value1(of第二个名字）+ value2 + value3＆amp; name3 =等等......

每当使用其他名称单击复选框时，必须在字符串中仅在URL中添加其对应名称后才能将其值添加到字符串中。必须使用Javascript / JQuery进行编码，并且还可以在JS中使用PHP。谢谢

Answer 1

您应该更新可以包含多个值的复选框的输入名称，以便可以选择它们。

＆＃13;

$(document).ready(function() {

  $('#choiceForm').on('submit', function(e) {
    e.preventDefault();
    var params = {}, regularizedParams = {}, allParams = [], allParamString;
    
    $(this).find("input")
            .each(function(i, el) {
            
              if (el.checked == true) {
                if (!params[el.name]) params[el.name] = [el.value];

                else params[el.name].push(el.value);
              }
            });

    for (key in params) regularizedParams[key.slice(0, -2)] = params[key].join('+');
 
    
    for (key in regularizedParams) allParams.push([key, regularizedParams[key]].join('='));
      
    allParamsString = allParams.join('&');
    console.log(allParamsString); // chuck this into your URL
    
  });
});

＆＃13;

<head>
</head>
<body>

<form id="choiceForm">
  <input name="iceCream[]" type="checkbox" value="vanilla"> Vanilla
  <input name="iceCream[]" type="checkbox" value="chocolate"> Chocolate
  <input name="iceCream[]" type="checkbox" value="strawberry"> Strawberry
  <button type="submit">Choose icecream flavor</button>
</form>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</body>

＆＃13;

如何在Javascript中将不同名称的复选框值添加到URL？

1 个答案: