jquery - 如何从输入中返回带有 jQ​​uery 的字符串并将其写入不同的 html 元素

Question

我正在使用这个：

var title = $('#input').val();
$('#titleset').click(function (){
    $('#title').html('<h1>' + title + '</h1>'); 
    alert(title);
});

尝试获取一个input框的值，然后当用户单击按钮时#titleset，将输入框中的值覆盖到<h1>已经存在的元素。我已经能够点击覆盖<h1>元素，但是标题变量中没有任何内容可以写入元素。那么我如何从#inputid 返回一个字符串并将其写入 #title id 这是一个<h1>元素

这是我的html

<h1 id="title">This Title Changes To What You Want It To Be</h1>
<ul class="menu1">
    <li>menu one
        <ul>
            <li id='inputbox'><input type ="text" id="input"/></li>
            <li id="titleset1"><input type="button" value="set title" id="titleset"/></li>
        </ul>
    </li>
</ul>

Answer 1

您需要在点击处理程序中访问输入的值：

$('#titleset').click(function (){
    var title = $('#input').val();
    $('#title').html('<h1>' + title + '</h1>'); 
    alert(title);
});

Answer 2

这太简单了（只需三行代码）。尝试这个：

$('#titleset').click(function() {
    $('#title').html($('#input').val());
});​

Answer 3

你应该这样使用：

$('#titleset').click(function (){
    $('#title').html('<h1>' + $('#input').val()+ '</h1>'); 
    alert(title);
});

Answer 4

你可以这样做，

jQuery代码

<script language="javascript" type="text/javascript">
$(function(){
    $('#titleset').click(function (){
        $('h1').html($('#input').val());
    });
});
</script>

html代码

<h1>hello</h1>
<input name="" id="input" type="text" value="VALUE"/>
<input name="titleset" id="titleset" type="button" value="CLICK"/>