0

我对 jquery 很陌生。在这里,我要做的是创建文本框和按钮(登录表单)。以下代码给了我重复的结果。我的代码有问题吗?

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css">
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
</head>
<body>
<script type="text/javascript">
$(document).ready( function () {    
        $(".start").append('<div data-role="fieldcontain"><label for="username">User Name:</label><input type="text" name="username" id="username"></br><label for="password">Password:</label><input type="password" name="password" id="password"></div><div data-role="content"><input type="submit" value="Sign In"/></div>');
        return false;
        });     
</script> 
<br>
<br>
      <div class="start">
        <label class="control-label" for="inputEmail">Sign In to xRM 360</label>
      </div>
<br>
<br>      
</body>
</html>
4

1 回答 1

-1

正在发生的是 $(document).ready 被调用了两次。我认为这可能与 jQuery 移动有关。

请参阅此处: jQuery $(document).ready () 触发两次 这里:http: //forum.jquery.com/topic/jquery-jquerymobile-document-ready-call-twice 了解更多信息。

一个快速的解决方法是将 script 标签放在 head 标签中。请参见下面的示例。

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css">
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>

<script type="text/javascript">
$(document).ready( function () {       
        $(".start").append('<div data-role="fieldcontain"><label for="username">User Name:</label><input type="text" name="username" id="username"></br><label for="password">Password:</label><input type="password" name="password" id="password"></div><div data-role="content"><input type="submit" value="Sign In"/></div>');
        return false;
        });     
</script> 

</head>
<body>

<br>
<br>
      <div class="start">
        <label class="control-label" for="inputEmail">Sign In to xRM 360</label>
      </div>
<br>
<br>      
</body>
</html>
于 2013-10-17T04:37:59.333 回答