如何使用jQuery将值从输入放入段落标记？

Question

var innerValue = $('.edit-location').val(); // i am getting value from input

var locationText = $('.location-text').text(); // i am getting inner text from target paragraph

$('.save-button').click(function () {
   innerValue =  locationText; // i am putting value from input to the paragraph 
    $('.popup-block').removeClass('active'); // hiding popup with input
});

Answer 1

解决方案：

替换

innerValue = locationText;

通过

$('.location-text').text($('.edit-location').val());。

说明：

jQuery的.text()功能可以作为getter，也可以作为setter。

如果你没有传递任何参数， 会返回 您调用它的元素的当前文本。

如果您像String一样向.text("Hello!")传递String，则它可以作为设置者将元素的文本设置为您传递的var innerValue = $('.edit-location').val(); 。

第二个问题

locationText

请注意locationText的内容仅在执行该行 时读取 一次 - 您的代码行不会导致任何形式数据绑定，这意味着当$('.save-button').click(function () { $('.location-text').text($('.edit-location').val()); // i am putting value from input to the paragraph // $('.popup-block').removeClass('active'); // hiding popup with input }); 时，不会在输入值发生变化时自动更改。因此，请确保在您需要时准确读取输入值。

这就是您的代码需要的样子：

＆＃13;

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class="edit-location" />
<p class="location-text">Placeholder text until you click this button below:</p>
<button type="button" class="save-button">Save</button>

＆＃13;

public chartClicked(e: any): void {
  if (e.active.length > 0) {
  const chart = e.active[0]._chart;
  const activePoints = chart.getElementAtEvent(e.event);
  if ( activePoints.length > 0) {
   // get the internal index of slice in pie chart
   const clickedElementIndex = activePoints[0]._index;
   const label = chart.data.labels[clickedElementIndex];
   // get value by index
   const value = chart.data.datasets[0].data[clickedElementIndex];
   console.log(clickedElementIndex, label, value)
  }
 }
}

＆＃13;

＆＃13;

＆＃13;

Answer 2

您是否尝试附加值？您可以使用$(SELECTOR).text(YOUR_VARIABLE)设置<p>代码的内部文字。