0

我需要从页面的另一部分获取代码而不将其放入表单中……有没有办法用 JavaScript/jQuery 来做？

本质上，我想从这里获取价值：

<div class='span5' style='margin-left:0px !important;'>
    <label for='area0'>
        <input type='checkbox' name='area' id='area' value='West Palm Beach' style='margin-top:-5px !important;'>
        West Palm Beach
    </label>
</div>

并将其放入同一页面上其他地方存在的表单中。

<form method="post" class="form-horizontal" id="final_form" action="send_mail.php">
    MORE INPUTS
</form>

有没有一种简单的 JavaScript 方法可以做到这一点？如果复选框被选中，我只想获取该值并将其分配为表单中的一个值，以便将其传递给 send_mail.php。

4

4 回答 4

2

您可以在表单中添加隐藏字段，例如：

<input type="hidden" id="area_is_checked" name="area_is_checked" />

然后在提交表单之前使用 JQuery 获取复选框值：

$("#final_form").submit(function () {
  $("#area_is_checked").val($("#area").is(':checked'));
  return true;
});
于 2013-08-07T21:08:55.227 回答
1

当然！

$('form#new-location').append($("div#move-me-please"));

这是一个 jsFiddle：http: //jsfiddle.net/zwxPt/

编辑：因为答案是在我写完之后编辑的：

如果您确实无法向表单添加隐藏字段，您仍然可以在用户通过 ajax 提交表单时向表单添加额外数据。有关更多信息，请参阅此 stackoverflow 问题。

于 2013-08-07T21:02:18.930 回答
0

就在这里..

    <div id="inputsBlock" class='span5' style='margin-left:0px !important;'>
    <label for='area0' style="display: none;">
        <input type='checkbox' name='area' id='area' value='West Palm Beach' style='margin-top:-5px !important;'>
        West Palm Beach
    </label>
</div>
<form method="post" class="form-horizontal" id="final_form" action="send_mail.php">
MORE INPUTS
</form>

<script>
$('#inputsBlock').children().clone().css({display: 'none'}).appendTo($('#final_form'));
</script>
于 2013-08-07T21:10:04.967 回答
0

您可以使用该form属性（至少适用于 Opera 9.5+、Safari 5.1+、Firefox 4+、Chrome 10+）：

<input type='checkbox' name='area' id='area' value='West Palm Beach' style='margin-top:-5px !important;' form="final_form">

有一个 Modernizr 测试。但是，您仍然可以使用该form属性，然后搜索那些而不是硬编码外部输入，如下所示：

$('#final_form').on('submit', function() {
    $('input[form=' + this.id + ']').each(function() {
        var externalInput = $(this);
        // then same as below.
    });
});

或者使用 jQuery 而不是form属性：

$('#final_form').on('submit', function() {
    var externalInput = $('#area');
    var name = externalInput.attr('name');
    /* use existing */
    var hidden = $(this).find('input[name=' + name + ']');
    /* create a new hidden field */
    if ( ! hidden.length ) {
        hidden = $('<input>', {
            name: name
        }).appendTo(this);
    }
    hidden.val(externalInput.is('[type=checkbox]') ? externalInput.prop('checked') : externalInput.val())
});

这将创建一个隐藏字段，或者，如果您正在对其进行验证并且它可能实际上并未提交，请使用已添加的字段。这不需要更新到 HTML。

于 2013-08-07T21:06:54.220 回答