Question

我有这个代码 HTML

set @SQLQuery = 'update top (200) ' +@tablename+ 
  ' set Flag1 = ''new'' where [Flag1] = '+@flag1+'';

Jquery的

    <h2 class="p1">Player 1</h2>
    <input type="text" class="addName1" value="Player 1"></input><button class="addName1b">Add name</button>

我希望播放器1在按下按钮时从输入框更改为文本，但无法弄清楚如何。请帮忙：）正如您所看到的，我计划使用.appendTo，但我不知道如何从input元素访问文本。

谢谢

Answer 1

使用这行代码

 $('.p1').text($('.addName1').val());

在$(/*TEXT FROM INPUT*/).appendTo(".p1");

的地方

appendTo不是您的目标的正确选择，appendTo用于将元素附加到另一个，但您的要求是更改元素的文本，您必须使用{{1} }

这是一个工作片段。

＆＃13;

.text()

＆＃13;

$('.addName1b').click(function() {
    var $this = $(this);
    $this.toggleClass('addName1b');
    if ($this.hasClass('addName1b')) {
        $this.text('Add name');
    } else {
        $this.text('Change name');
    }
    $('.addName1').toggle();
    $('.p1').text($('.addName1').val());
});

＆＃13;

Answer 2

使用变量存储新名称
使用.val()
反转最后一行，因为选择器$('.p1')先行，然后值为最后(newName)。
没有括号，因为它是表示字符串的变量。

将最后两行更改为：

 var newName = $('.addName1').val();
$(".p1").text(newName);

＆＃13;

$(function() {
  
$('.addName1b').click(function() {
    var $this = $(this);
    $this.toggleClass('addName1b');
    if ($this.hasClass('addName1b')) {
        $this.text('Add name');
    } else {
        $this.text('Change name');
    }

    var newName = $('.addName1').val();
    $(".p1").text(newName);
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<script src="http://gh-canon.github.io/stack-snippet-console/console.min.js"></script>


<h2 class="p1">Player 1</h2>
<input type="text" class="addName1" value="Player 1" />
<button class="addName1b">Add name</button>

＆＃13;

Answer 3

也许你应该使用一些框架？）像angular，knockout，reactjs之类的东西？非常适合这样的目的。

但是。要读取输入值，您可以使用以下内容：

  $('#id').val();

Answer 4

输入不会像这样关闭

<h2 class="p1">Player 1</h2>
<input type="text" class="addName1" value="Player 1"></input><button class="addName1b">Add name</button>

只是

<input .... />

你的JS修改

$('.addName1b').click(function() {
    var $this = $(this);
    var $input_val = $('.addName1').val();
    $this.toggleClass('addName1b');
    if ($this.hasClass('addName1b')) {
        $this.text('Add name');
    } else {
        $this.text('Change name');
    }
    $('.addName1').toggle();
    $('.p1').text($input_val);
});

这里的jsfiddle：https://jsfiddle.net/qgumjy7b/

希望这有助于理解你错过了什么。

单击按钮时将<p>更改为输入值

4 个答案: