Question

我有三个HTML选择框（单选）和一个锚。

用户选择他们的3个选项，然后按下按钮确认他们的选择。单击后，三个值将添加到单个span标记内的div中，并且还会添加到隐藏的输入值字段以进行表单提交。

我遇到的问题是，如何将多个jQuery变量分配给输入＆＃34; value =＆＃34;＆＃34; ＆＃34;场？

我试过了：

$('#values').val('+myvar1+myvar2+myvar3');

除了其他几种组合，但没有错误，输入为空白。

JsFiddle

感谢您的时间

Answer 1

代码中存在很多错误。但是我修好了。始终尝试在浏览器上right click and inspect查看控制台是否有任何错误。

您使用了id =＆＃34; myval1＆＃34;在<select>元素中，但是将它们作为$（＆＃39; .myval1＆＃39;）访问，这是一个名为＆＃34; myval1＆＃34;的css类的选择器。
同样的情况适用于您使用过的所选选项。

JSFiddle

HTML

<div>
  <select id="myval1">
    <option value="0">Zero</option>
    <option value="1">One</option>
    <option value="2">Two</option>
  </select>
</div>
<div>
  <select id="myval2">
    <option value="0">Zero</option>
    <option value="1">One</option>
    <option value="2">Two</option>
  </select>
</div>
<div>
  <select id="myval3">
    <option value="0">0</option>
    <option value="1">1</option>
    <option value="2">2</option>
  </select>
</div>
<p class="action"><a href="#">+ Add</a></p>
<div class="values">
Spans will be here
This will be hidden
</div>

的Javascript

$('.action').on('click',function (e) {
            e.preventDefault();
            var select1 = $( "#myval1" ).val();
            var select1text = $("#myval1 option:selected").text();
            var select2 = $( "#myval2" ).val();
            var select2text = $("#myval2 option:selected").text();
            var select3 = $( "#myval3" ).val();
            var select3text = $("#myval3 option:selected").text();
            $('.values').append('<span>'+select1text+ '</span>');
            $('.values').append('<span>'+select2text+ '</span>');
            $('.values').append('<span>'+select3text+ '</span>');
            $('.values').append('<input name="opentimes" id="open-time" />');
            $('#open-time').val(""+select1+select2+select3);
        });

Answer 2

可能这个解决方案可以帮助您解决问题。请使用以下提到的链接。

JSfiidle link

HTML代码

<div>
    <select id="myval1">
        <option value="0">Zero</option>
        <option value="1">One</option>
        <option value="2">Two</option>
    </select>
</div>
<div>
    <select id="myval2">
        <option value="0">Zero</option>
        <option value="1">One</option>
        <option value="2">Two</option>
    </select>
</div>
<div>
    <select id="myval3">
        <option value="0">0</option>
        <option value="1">1</option>
        <option value="2">2</option>
    </select>
</div>
<p class="action"><a href="#">+ Add</a>
</p>
<div class="values">
    Spans will be here This will be hidden
</div>

JAVASCRIPT代码

$('.action').on('click',function (e) {
        e.preventDefault();
        var select1 = $("#myval1 option:selected").val();
        var select1_text_1 = $("#myval1 option:selected").text();
        var select2 = $("#myval2 option:selected").val();
        var select1_text_2 = $("#myval2 option:selected").text();
        var select3 = $("#myval3 option:selected").val();
        var select1_text_3 = $("#myval3 option:selected").text();
var allVal = (parseInt(select1)+parseInt(select2)+parseInt(select3));
        $('.values').append('<span>'+select1_text_1+ '</span>');
        $('.values').append('<span>'+select1_text_2+ '</span>');
        $('.values').append('<span>'+select1_text_3+ '</span>');
        $('.values').append('<input name="opentimes" id="open-time" />');
        $('#open-time').val(allVal);
    });

如何获取多个输入的值并将值分配给不同的表单控件？

2 个答案: