Question

我想在td a.btn { display: inline-block; margin: 0 2px; }标记内呈现输入文本值。我能够将输入文本值呈现给其他输入，但是如何在<p></p>标记内呈现？

HTML：

<p></p>

JavaScript的：

<input type="text" placeholder="Type PCP Name" class="form-control" id="PCPName"  /><br /> <br />
Selected PCP:

<input id="selectedPCP" disabled="disabled" value="Not Selected" />
<!--<p id="selectedPCP"> hey <p>-->

Answer 1

您需要使用.text() / .html()代替.val()来设置p元素的内容：

 $('#selectedPCP').text(nameValue);

您应该在附加事件后触发加密，以查看加载本身的更改。您也可以将代码缩小到：

$('#PCPName').keyup(function(){
    var nameValue = $('#PCPName').val();
    $('#selectedPCP').text(nameValue == "" ? 'Not Selected' : nameValue);
}).keyup();

<强> Working Demo

Answer 2

.val()适用于input和textarea

等字段元素

$('#selectedPCP').text('Not Selected');

进入你的状况：

if (nameValue == ""){
    $('#selectedPCP').text('Not Selected');
}
else{
    //alert(nameValue);
    $('#selectedPCP').text(nameValue);
}

Answer 3

使用.text()

$('#PCPName').on('keyup change', function () {
    $('#selectedPCP').text(this.value || 'Not Selected');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" placeholder="Type PCP Name" class="form-control" id="PCPName" />
<br />
<br />Selected PCP: <p id="selectedPCP">hey<p>

Answer 4

如果您不想覆盖append标记中的当前文字，请在您的p标记上使用jquery'p。此外，将ID更改为类，以便它可以同时适用于input和p元素。

https://jsfiddle.net/wpmnvbow/1/

这是一个更新的小提琴，用于keyup和更好的方法：https://jsfiddle.net/wpmnvbow/2/

我想在<p> </p>标记内呈现我的输入文本值

4 个答案: