0

我正在建立一个注册表。#onimg och #offimg 是两个带有 img 的 div。如果您填写一个可用的用户名，#offimg 将显示，如果您选择一个已经使用的用户名，#onimg vill 将显示。

如果您在注册字段中根本没有写任何东西（例如，如果您确实删除了文本），我希望图像隐藏。但他们不=（。

这是HTML

<ul>
    <li>Username:</li>
    <li>Password:</li>
</ul>

<ul>

    <li><input type="text" id="user" name="user" value="" /></li>
    <li><input type="text" id="pass" name="pass" value="" /></li>
    <li><input type="checkbox" name="show" value="password">Show password</li>
</ul>

<div id="onimg"></div>
<div id="offimg"></div>


</fieldset>

<button type="button" id="reg" value="" >Register</button>

一些CSS

#onimg {
  z-index:1000;
  position:absolute;
  left:300px;
  top:23px;
  background-image:url('notavailable.png');
  width:20px;
  height:20px;
}

#offimg {
  z-index:1000;
  position:absolute;
  left:300px;
  top:23px;
  background-image:url('available.png');
  width:20px;
  height:20px;
}

这是jquery

$('#user').focusout(function(){

  var users = $('#user').val();

  $.getJSON( "available.php" ,      //The URL to perform the lookup
     {name: users }, //The data you send
     function (result){     //The function to fire upon return
         if (!result) {       //result is JSON formatted
             $('#onimg').fadeIn('fast');
         } else  {
             $('#offimg').fadeIn('fast');
         }                                             
  });

});

$(function() {
    $('#user').blur(function() {
        if($(this).val() == '') {
            $("#onimge").hide();
            $("#onimge").hide();
        }
    });
});
4

1 回答 1

1 
$(function() {
    $('#user').blur(function() {
        if($(this).val() == '') {
            $("#onimge").hide(); // You misspelled #onimg
            $("#onimge").hide(); // This one should be #offimg, not a repeat of #onimg
        }
    });
});

顺便说一句，您可以一次调用两个图像：

$("#onimg, #offimg").hide();

您还应该将$("#user").focusout()处理程序放在文档就绪函数中。

于 2013-07-16T10:16:55.347 回答