Question

我正在使用悬停样式效果来访问Wikipedia查看器的表单字段和文本提示，到目前为止一切正常，但是它与精致和快乐之间存在很大差异。

当悬停在井上时会放大以打开表格字段但是当鼠标离开并且字段崩溃时，内部文本消失，是否有任何方法可以保留输入文本？

var toggler = true;

var wellToggle = function(){
  $("#well").toggleClass("toggleMe")
  if (toggler === true){
    $("#magniText").append('<input class="formstyle" type="text" name="wikiFind" placeholder="***">') //if true adds input form field for user
$("#jiggyText").text("Random Article")
toggler = false;
  } else {
    $("input").detach() //removes user input here, unable to find another solution that retains user text input
    $("#jiggyText").text("")
    toggler = true
  }
};

$("#well").hover(wellToggle, wellToggle);

我知道.remove()完全擦除了元素，但我希望.detach()能保留文本，但似乎它只保留数据，我希望用户输入替换* **提示坚持.detach()。

我能找到的最接近解决方案的是this，它检查文本并仅替换它的缺席，但我需要保留文本。

这是我的代码link

Answer 1

为什么不在删除之前将文本保存在输入中，然后在

上设置输入文本

var toggler = true;
var inputText ='';
var wellToggle = function(){
  $("#well").toggleClass("toggleMe")
  if (toggler === true){
    $("#magniText").append('<input class="formstyle" type="text" name="wikiFind" placeholder="***">')
    $("#jiggyText").text("Random Article")
    $("input").val(inputText);
    toggler = false;
  } else {
    inputText = $("input").val()
    $("input").detach()
    $("#jiggyText").text("")
    toggler = true
  }
};

$("#well").hover(wellToggle, wellToggle);

这是粘贴箱http://jsbin.com/vozuheduti/edit?html,js,output

中的代码

使用jquery分离表单元素但保留文本

1 个答案: