返回列表 發帖

HOW 使用$.blockUI - 效果填寫登入資訊及傳送資料,接收回傳參數

參考了
http://www.malsup.com/jquery/block/#demos  
Demos -1
不懂這各方式 該如何去傳送登入的帳號密碼 以及 如何回傳的參數 該如何取得
請問可否說明一下

$(document).ready(function() {
    $('#demo1').click(function() {
        $.blockUI({ message: $('#loginForm') });

        setTimeout($.unblockUI, 2000);
    });
});
     
.........
<button id="demo1">Run loginForm</button>
.........
<div id="loginForm" style="display:none">
            <p><label>Username:</label><input type="text" name="demo1" /></p>
            <p><label>Password:</label><input type="text" name="demo1" /></p>
        </div>

TOP

請問版主~

如果的網頁有三個frameset(上, 左, 右)  我的submit在右邊, 顯示出來的資料會在左邊~
如果我在右frame做遮罩時, 只會出現在右邊, 要如何讓他出現在正中間呢???

TOP

測試成功!
留個記錄~
[full page code:]

<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>jq-blockUI</title>  
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>  
<script type="text/javascript" src="js/jquery.blockUI.js"></script> 
<script type="text/javascript">
// hide & show message- blockUI  
$(document).ready(function() {
    $('#demo1').click(function() {
                $.blockUI({ message: $('#welcome') });
           setTimeout($.unblockUI, 3000);
  });
});  
</script>
</head>

<body>

<h1>Block fullpage</h1>
<p>hide & show message- blockUI</p>
<p><input type="button" value="show message" id="demo1" /> </p>
<!-- Hidden Message -->
<div id="welcome" class="welcome-style" style="display:none" >
<h3>歡迎來到 yourDomain.com !</h3>
</div>
<!-- Hidden Message -->


</body>
</html>

TOP

本帖最後由 diddo 於 2013-1-13 03:04 編輯

re:eason-HOW 使用$.blockUI填寫登入資訊...
(雖然outdate了),回應一下問題~
我是這樣寫,有錯歡迎指正!

*只試了頁面,未測試數據~
[full page code:]
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jq-blockUI</title>   
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>  
<script type="text/javascript" src="js/jquery.blockUI.js"></script> 
<script type="text/javascript">  
$(document).ready(function() {
    $('#demo1').click(function() {
        $.blockUI({ message: $('#loginForm') });
    });
    $('#btn_close').click(function() {
         $.unblockUI();
    });       
});  
</script>
<style type="text/css">
.btn_close01 { display:block; float:right; background-color:#000000; color:#FFFFFF; width:30px; height:30px; font-size:28px;}
#form01{ background-color:#fff; padding:20px;}  
  </style> 
  </head> 
   
<body>
<h3>hide & show Login Form-全頁遮罩</h3>
  
<p><input type="button" value="Login" id="demo1" /> </p>
  
<!-- Hidden form -->
<div id="loginForm" style="display:none" >
<div class="btn_close01" id="btn_close"> X </div>

    <form id="form01" action="loginprocess.php" method="post">
    <p><label>Username:</label><input type="text" name="name" /></p>
    <p><label>Password:</label><input type="password" name="password" /></p> 
    <input type="submit" name="submit" value="Login" />
    </form>
</div>
<!-- Hidden form -->

</body>
</html>

TOP

返回列表 回復 發帖