1

这是我的 jquery,用于在单击锚标记时显示文本框

$("a").click(function () {

var textbox = $('<input id="txt1" type="text" />')

var oldText = $(this).text();

 $(this).replaceWith(textbox);

           textbox.val(oldText);

     $(this).html($('<input id="txt1" type="text" />').val())

     });

我的锚标签

 <a>hello</a>

当文本框显示文本时使用它我想更改文本框中的文本并显示锚标签的新文本

4

2 回答 2

1

我不确切知道您要获得什么,但以下代码可以进行动态锚文本编辑。我认为没有必要更换<a>元素,我们可以隐藏它:

$("a").click(function() {
    $("<input />").val($(this).hide().text()).on("blur", function() {
        $(this).prev("a").text(this.value).show();
        $(this).remove();
    }).insertAfter(this).trigger("focus");
});​

演示:http: //jsfiddle.net/8dpyG/

于 2012-06-28T09:24:31.960 回答
1

试试这个 :

jQuery(document).ready(function(){

$('html').click(function(e){
        if(e.target.id == 'txt1' || e.target.id == 'link1') {
                var textbox = $('<input id="txt1" type="text" />')
                var oldText = $(jQuery("#link1")).text();
                $(jQuery("#link1")).replaceWith(textbox);
                textbox.val(oldText);
                $(jQuery("#link1")).html($('<input id="txt1" type="text" />').val())
       } else {
          var newText =  jQuery('#txt1').val()
          var link = jQuery("<a id='link1'></a>");
          jQuery('#txt1').replaceWith(link);
          jQuery('#link1').text(newText);
      }
    });
});
</script>
<html>
<body>
<a id="link1">hello</a></body>
</html>

这是演示

于 2012-06-28T09:28:56.447 回答