【问题标题】:how to append new text to div for each click?如何为每次点击将新文本附加到 div?
【发布时间】:2014-11-06 14:27:15
【问题描述】:

我有一个多选复选框选项。这类似于不同状态的下拉菜单。用户可以检查多个状态。我的要求是当用户选中所选州名称需要显示的任何复选框时。如果他选择阿拉斯加,需要显示阿拉斯加和 如果他选择另一个阿拉巴马州需要同时显示。

但是我现在的代码显示了一些奇怪的东西。

我的代码

<p id="selectedid" class="selected_class"></p>

options.each(function() {
    $("#selectedid").insertAfter($(this).text() + ', ');
});

另一个代码

options.each(function() {
    $("#selectedid").append($(this).text() + ', ');
});

但是当我使用$("#selectedid").html($(this).text() + ', '); 时,总是显示一个选定的选项,旧选项被新选项替换。对我来说,当用户第一次查看阿拉斯加时,它会在 p 标签中显示阿拉斯加。第二次如果用户检查阿拉巴马州它正在显示

第二个结果

Alaska , Alaska, Arizona

第三次如果用户检查阿肯色州它显示

第三个结果

Alabama, Alabama, Arizona, Alabama, Arizona, Arkansas

我的实际要求是用户选择的需要显示的选项以及他是否撤消需要隐藏的检查。假设如果他选择了 3 个状态,则只需要显示 3 个状态

Alabama
Arizona
Arkansas

我没有找到我做错的地方。

【问题讨论】:

  • 那是java脚本吗?如果是这样,** 不是有效评论。看着那个代码,我的眼睛很痒.. 0__0
  • 这是我的第一个问题,我是新手。你们需要建议格式。
  • @TJ 你的眼睛现在安全了 :)
  • 我正在使用 bootstrap mult select dropdown 。在该下拉列表中,每个选择选项都包含复选框。因此用户可以选择多个复选框。我试图在这个 p 标签中显示的那些选定值

    这里需要显示选定值

标签: javascript jquery append


【解决方案1】:

这有帮助吗?

http://jsfiddle.net/yq56t8cu/2/

HTML

<input name="options" type="checkbox" value="Alabama" checked="checked"/ > Alabama
<input name="options" type="checkbox" value="Arizona" / > Arizona

<p id="selectedid" class="selected_class"></p>

JavaScript

$("input[name='options']").click(showAll);

function showAll() {
    var options = $("input[name='options']:checked");
    var temp = "";


    options.each(function() {
        temp += $(this).val();
        temp += "<br\>";

    });

    $("#selectedid").html(temp);
}

showAll();

【讨论】:

  • 应该是
    而不是
【解决方案2】:
options.each(function() {
if(!$("#selectedid").find($(this)).length)
$("#selectedid").append($(this).text() + '<br/>');
});

【讨论】:

    猜你喜欢
    • 2021-10-01
    • 2011-08-06
    • 2019-11-18
    • 1970-01-01
    • 2014-11-05
    • 1970-01-01
    • 1970-01-01
    • 2014-01-04
    相关资源
    最近更新 更多