Question

我有一个文本框和一个按钮。当我单击按钮时，文本框内容将使用jQuery中的<body>方法附加到append()。此外，在追加时，我正在尝试将style（即border-style）设置为我追加的标签。以下代码没有达到我的预期：

<style>
.myStyle{
    border-style:solid;
}
</style>

<script>
$(document).ready(function()
    $("#btn2").click(function(){
        var text=document.getElementById('txt1').value
        $("body").append("<br><label class="myStyle">"+text+"</label>");
    });
});
</script>
<input id="txt1" type="text">
<button id="btn2">Append list items</button>

在<div>部分添加append标记也无济于事。以下情况，但第一个标签盒没有获得保证金：

<script>
$(document).ready(function()
    $("#btn2").click(function(){
        var text=document.getElementById('txt1').value
        $("label").css("border-style","solid");
        $("body").append("<br><label>"+text+"</label>");
    });
});
</script>
<input id="txt1" type="text">
<button id="btn2">Append list items</button>

与append()和样式元素有什么关系？我错过了什么？

Answer 1

$("body").append("<br><label class="myStyle">"+text+"</label>");
//---------------^-----------------^
// These are the same type of quotes

$("body").append('<br><label class="myStyle">'+text+'</label>');
//---------------^---------------------------^------^--------^
// Swap these four out with single quotes

你应该在语法高亮显示中注意到，myStyle变黑了，在字符串中显示中断如果您当前的编辑器没有向您显示此类错误，我建议您使用更好的编辑器。就个人而言，我使用的是WebStorm / PHPStorm。

另外，如果你要使用jQuery，那么使用jQuery。

var text = $('#txt1').val();

无法在jQuery.append（）中设置标签样式？

1 个答案: