0

所以我在一个表单中有一个包含 8 个复选框的列表。这些复选框应该控制将在框架中加载的链接。但是我不知道从哪里开始...
Checkbox1(appendThis1) - 检查
Checkbox2(appendThis2)
Checkbox3(appendThis3) - 检查
Checkbox4(appendThis4)
Checkbox5(appendThis5) - 检查
Checkbox6(appendThis6)
Checkbox7(appendThis7)
Checkbox8(appendThis8)

因此，基于此，我将有一个基本 URL，例如http://www.google.com，并且由于 checkbox1、3 和 5 检查了 appendThis1、appendThis2、appendThis3 将被添加到 url 的末尾，但没有一个其他复选框会将任何内容附加到 URL。每个复选框都会向 URL 添加或删除其特定参数。
同样，每当检查复选框时，它将重新加载URL。

4

2 回答 2

0

我会这样做的方式如下

  • 确保在您的 html 表单中，所有复选框都具有相同的名称，最后带有空方括号，这样您将在 php.ini 中返回一个数组。作为值，您应该设置要附加到 html 的字符串。像这样的东西：

<input type="checkbox" value="q=something" name="myCheckboxes[]" /> option 1
<input type="checkbox" value="lang=en" name="myCheckboxes[]" /> option 2
...

  • 在您的 php 代码中，只需将您通过帖子返回的 内爆 te 数组，并将其附加到您的 html 中。（在此处查看更多信息http://www.html-form-guide.com/php-form/php-form-checkbox.html）。伪代码如下所示：

    $url = 'http://www.google.com?';
    $checkboxes = $_POST['myCheckboxes'];
    $url .= implode('&', $checkboxes);

  • 对于选中复选框时的自动提交，您将需要一些客户端脚本。我的选择是 jQuery，它看起来像这样：

    $('#myForm input[type="checkbox"]').change(function() {
    $('#myForm').submit();
    };

请注意，没有任何代码经过测试，但它应该可以正常工作，或者至少可以为您指明正确的方向。当然欢迎指正！

于 2013-01-24T22:10:36.937 回答
0

原始 Javascript 示例。您可以使用生成的 URL 来加载 iframe。

jsFiddle

<script language='javascript'>

arr_sel = new Array();


function constructURL(cv)
{
  if (arr_sel.length==0)
  {
     arr_sel.push(cv);
  } else {

    if (inArray(cv, arr_sel))
    {
        key = getKey(cv, arr_sel);
        arr_sel.splice(key,1);
    } else {
        arr_sel.push(cv);
    }

  }
  makeURL(arr_sel);

}
function inArray(val, arr) 
{
    var length = arr.length;
    for(var i = 0; i < length; i++) {
        if(arr[i] == val) return true;
    }
    return false;
}

function getKey(val, arr)
{
  for (var i = 0; i < arr.length; i++) 
  {
    if (arr[i]==val)
      return i
  }
}

function makeURL(arr_sel)
{

  opts = new String; 
  arr_opts = new Array();
  for (var i = 0; i < arr_sel.length; i++) 
  {
    arr_opts.push(arr_sel[i]);
  }
  url = 'http://google.com?' + arr_opts.join('&');

  document.getElementById('myurl').innerHTML = url;

}
</script>

<input type=checkbox name=whatever value='opt1=foo' onClick="constructURL(this.value)"> foo <br>
<input type=checkbox name=whatever value='opt2=bar' onClick="constructURL(this.value)"> bar <br>

<div id='myurl'>http://google.com?</div>
于 2013-01-24T22:10:52.540 回答