要将两个选择标记的值放在<输出>中,请 HTML

to put the value of two select tag in a <output>, html

本文关键字:输出 HTML 两个 选择      更新时间:2023-09-26

我有两个选择标签,我希望当用户在每个选择标签中选择一个值时,有一个显示两个值的输出:

例如,如果在第一个标签中有人选择cars,而在 seccon golf 中,我想在输出中包含表达式cars,golf..我该怎么做?请帮助我

这是一个纯JavaScript的工作演示。

我提出的解决方案是捕获onchange事件并使用 innerHTML 将其显示在div 标签中。

.HTML:

<select id="select1">
   <option> cars </option>
   <option> bikes </option>
</select>
<div id="output"></div>

JavaScript:

document.getElementById("select1").onchange=function(){
    var e = document.getElementById("select1");
    selected1  = e.options[e.selectedIndex].text;
    if(selected2!="")
       document.getElementById("output").innerHTML = selected1 + ", " + selected2;
};

这是一个粗略的想法,你需要根据自己的需要进行细化

<script type="text/javascript">
            $(function(){
            var sb1_val;
            var sb2_val;
             $('#sb1').on('change', function() 
             {
                sb1_val = this.value ;
             });
             $('#sb2').on('change', function()
             {
                sb2_val = this.value ;
                 console.log(sb1_val+','+sb2_val); //this will output the both
                 alert(sb1_val+','+sb2_val); //this will output the both
             });
            });

        </script>

    <select id='sb1'>
        <option value='car1'>car1</option>
        <option value='car2'>car2</option>
    </select>

    <select id='sb2'>
        <option value="golf1">golf1</option>
        <option value='golf2'>golf2</option>
    </select>

演示

只需使用 jQuery 中的.change()即可。

$("select").change(function(){
    //output the values
    $("#my_output").val($("#s1").val() + "," + $("#s2").val());
});

在这里演示。