Question

<div id="form_title">
    <h1>Form Title</h1>
</div>

这是我的HTML代码。我想创建一个文本框，用户可以更改h1的值并保存它。

这是我的尝试。

$('#form_title').click(function() {
    $(this).html('<input id="form_title_value" name="form_title_value"
                         type="text" placeholder="Enter Form Title..."> ');
});

问题是当我点击它时文本框失去焦点。

Answer 1

使用此：

$('#form_title').one('click', function() {
    $(this).html('<input id="form_title_value" name="form_title_value" 
                         type="text" placeholder="Enter Form Title...">')
               .find('input').focus();
});

Live DEMO

问题是你每次点击都会覆盖div的innerHTML 所以它不仅仅是松散的焦点而且＃34;但每次点击都会松开innerHTML。

one允许您附加仅触发一次的回调。

您也可以尝试this DEMO，它会向您展示如何更改<h1>文字

动态更改标题到文本框

1 个答案: