Question

我有以下标签：

var data = new FormUrlEncodedContent(new[]
{
    new KeyValuePair<string, string>("code", serverAuthCode),
    new KeyValuePair<string, string>("client_id", "MY_CLIENT_ID"),
    new KeyValuePair<string, string>("client_secret", "MY_CLIENT_SECRET"),
    new KeyValuePair<string, string>("grant_type", "authorization_code"),
    new KeyValuePair<string, string>("redirect_uri", "MY_REDIRECT_URI_DEFINED_IN_GOOGLE_CONSOLE")
});
var tokenResponse = await _httpClient.PostAsync("https://www.googleapis.com/oauth2/v4/token", data);

当我点击编辑按钮时，我想用输入替换标签，并将标签值设置为选中。以下是我到目前为止所尝试的内容：

<div id="email">
  <label>
    myemail@gmail.com
  </label>
  <i class="fa fa-edit"></i>
</div>

<div id="phone">
  <label>
    1234567890
  </label>
  <i class="fa fa-edit"></i>
</div>

问题是我无法将输入文本设置为选中（准备替换）。我该怎么办？

Answer 1

创建输入元素并设置焦点＆amp;更换标签后选择它。

请检查以下代码：

User::find($id)->favorites;

$("#editBtn").click(function(){
   var label = $(this).parent().find('label');
   var curr_value = label.text().trim();
   
   var newInput = $('<input class="edit_input" type="text" value="'+curr_value+'" />')
   
   label.replaceWith(newInput)
   newInput.focus().select()
    
})

Answer 2

从.replaceWith返回的值仍然是旧的<label />引用，您需要重新选择输入，以便您可以集中注意力。

label.replaceWith('<input class="edit_input" type="text" value="'+curr_value+'" />')
$('.edit_input').off('focus').on('focus',function() {
    this.select()
}).trigger('focus')

每次用户再次单击编辑按钮时，使用off（）删除上一个事件侦听器。

Answer 3

我希望能帮到你。

var label = $('label');
var curr_value = label.text();
label.replaceWith('<input class="edit_input" type="text" value="'+curr_value+'" />').focus(function(){
     $(this).select(); });

使用jquery设置创建的输入文本

3 个答案: