如何使用jquery禁用和启用文本框?

时间:2011-07-11 08:47:02

标签: javascript jquery

这里有一个文本框

<input name="" type="text" id="txt" onblur="txt(this)"/>

和jquery

function txt(th) {
  $(th).hide().after('<span class=\"dfk\">' + $(th).val() + '</span>');  
}

我已完成禁用文本框并显示文本框的值,但再次单击文本框的值。文本框应该使用值。

2 个答案:

答案 0 :(得分:0)

你可以做(​​如果我理解你需要的话):

<input name="" type="text" id="txt" />

$('#txt').blur(function(){
    $(this).hide().after('<span class="dfk">' + $(this).val() + '</span>');  
});

    $('.dfk').live('click', function(){
       $(this).prev().show();
       $(this).remove();
    });

在这里摆弄:http://jsfiddle.net/qJ3sY/2/

编辑 - 我更正了使用范围

答案 1 :(得分:0)

DEMO HERE

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("#txt")
    .focus(function() {
      $(this).removeClass("txtOff").addClass("txtOn");
    })
    .blur(function() {
      $(this).removeClass("txtOn").addClass("txtOff");
    });
});
</script>    
<style>
.txtOn { border:1px solid black; background-color:light-grey}
.txtOff { border:1px solid white; background-color:white}
</style>
<input name="txt" type="text" id="txt" class="txtOff" value="" placeholder="Click to edit" />