简体   繁体   English

选中的多个选择选项将使用javascript或jquery在另一个html元素中查看

[英]Multiple select option selected will be view in another html element using javascript or jquery

I have a multiple select option on html like this : 我在html上有多个选择选项,如下所示:

 <div class="control-group">
    <label class="control-label" for="selectError1">Ditujukan untuk :</label>
     <div class="controls">
          <select id="email" multiple data-rel="chosen" class="input-xlarge" name="email[]">
              <?php
                  foreach ($atasan as $data) {
                      echo "<option value='" . $data['email'] . "'>" . $data['email'] . "</option>";
                  }
            ?>

           </select>
       </div>
</div>

My goal is, when user selected an or any option, the option that selected will be view in another html element like <p id='emailSend'>This is the email : email1, email2... so on</p . 我的目标是,当用户选择一个或任何选项时,所选的选项将在另一个HTML元素(例如<p id='emailSend'>This is the email : email1, email2... so on</p

I am newbie in jquery. 我是jquery的新手。 I guess 'on change' or change can do this. 我猜“改变”或改变都可以做到。

This is the jquery's code: 这是jquery的代码:

$(document).ready(function() {
    $('#emailSend').hide();

    $('email').change(function(){
        //any idea ???
    });

}

EDIT I was wondering to increase my ability, how should I do if I want to append it on a input text like 编辑我想增加自己的能力,如果我想将其附加在输入文本上,该怎么办

<input type="text" id="emailSend" name="emailSend">

So, the jquery looked like this : 因此,jQuery看起来像这样:

$("#email").change(function() {
        var elements = $("#email option:selected").length;

        $(".emailSend").html("");
        $.each($("#email option:selected"), function(index, element) {
            $(".emailSend").val($(this).html());
            if (index < elements - 1) {
                $(".emailSend").append(", ");
            }
        });
    });

What you can do is : 您可以做的是:

$("#email").change(function() {
    var elements = $("#email option:selected").length;
    $("#emailSend").html("");
    $.each($("#email option:selected"), function(index, element){            
        $("#emailSend").append($(this).html());
        if (index < elements-1) {
           $("#emailSend").append(", ");
        }
    });
});

With emailSend being your block containing all the emails. 随着emailSend成为您包含所有电子邮件的阻止。 Note that this solution allows you to handle multiple values. 请注意,此解决方案允许您处理多个值。

EDIT : grammar :( 编辑:语法:(

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 如何使用纯Javascript找到HTML中select元素的select预选(选中)选项? - How to found or select pre selection (selected) option of select element in HTML using pure Javascript? 如果用户使用jquery选择3个以上选项,则从多个选择中删除最后选择的元素 - Remove last selected element from the multiple select if user select more than 3 option using jquery 如何根据另一个select html元素的选项值使用jQuery遍历select html选项 - How to iterate through select html options using jQuery depending on option value from another select html element JavaScript-已选择选项的HTML select元素onchange触发器 - JavaScript - HTML select element onchange trigger for already selected option 使用PHP和Javascript和JQuery选择另一个选择选项后,更新html选择选项 - Updating html select options after choosing another select option using PHP and Javascript with JQuery 使用jQuery在HTML选择中获取所选选项的文本 - Get selected option's text in an HTML select using jQuery 使用 javascript 在 html 中预先选择的选择选项 - pre-selected select option in html using javascript 默认选择的选项用于在IE中使用javascript进行html选择 - default selected option for html select using javascript in IE HTML SELECT - 使用JavaScript更改VALUE选定的选项 - HTML SELECT - Change selected option by VALUE using JavaScript 从选择字段中选择一个选项时,使用jquery输出javascript - using jquery to output javascript when an option selected from select field
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM