如何檢查用戶記錄的可用性，如果可用，請重新輸入以確保安全性？

Question

我們需要使用Ajax來調用php文件，以檢查數據庫中記錄的可用性。

如果記錄存在，請要求用戶再次輸入另一個框來重新確認令牌編號。

如果它們匹配，則用戶繼續填寫剩余的表格。

如果它們不匹配，則會引發錯誤。

我有兩個單獨的文件，可以實現雙重目的：檢查數據庫的可用性，並通過要求用戶重新輸入相同的數字來比較該記錄。

但是，我想將兩個文件合並為一個。

有人可以指導我嗎？

第一個文件使用ajax調用php文件，以檢查記錄的可用性。

它稱為index.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Check Availability of Token</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script src="jquery.js" type="text/javascript" language="javascript"></script>
<script language="javascript">
$(document).ready(function()
{
    $("#token").blur(function()
    {
        //remove all the class add the messagebox classes and start fading
        $("#msgbox").removeClass().addClass('messagebox').text('Checking...').fadeIn(1000);
        //check the token exists or not from ajax
        $.post("checkToken.php",{ user_token:$(this).val() } ,function(data)
        {
          if(data=='no') //if token not avaiable
          {
            $("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox
            {
              //add message and change the class of the box and start fading
              $(this).html('Token exists').addClass('messageboxerror').fadeTo(900,1);
            });
          }
          else
          {
            $("#msgbox").fadeTo(200,0.1,function()  //start fading the messagebox
            {
              //add message and change the class of the box and start fading
              $(this).html('Token does not exist').addClass('messageboxok').fadeTo(900,1);
            });
          }

        });

    });
});
</script>

</head>
<body>


<br>
<br>
<div align="center">
<div class="top" > Check Availability of token - <strong>Token &quot;roshan&quot;, &quot;mike&quot; ,&quot;jason&quot; exists</strong><br>
  Please move the focus out of the box to check the availability of token.
</div>
<div >
   Token : <input name="token" type="text" id="token" value="" maxlength="15" />
   <span id="msgbox" style="display:none"></span>
</div>

</div>

</body>
</html>

第二個文件稱為tokencompare.html

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title> - Compare Validate token</title>
  <script type='text/javascript' src='http://code.jquery.com/jquery-1.8.3.js'></script>
<script type='text/javascript'>//<![CDATA[
$(window).load(function(){
$("#confirm_token").parent().hide();
$("#token").keydown(function() {
    var self = this, $self = $(this);
    setTimeout(function(){
        if ( $.trim(self.value) != "" && !$self.is(".error") ) {
            $("#confirm_token").parent().show();
            return;
        }
        $("#confirm_token").val('').parent().hide();
    },0);
});

// validate signup form on keyup and submit
$("#tokenval").validate({
    rules: {
        token: {
            required: true,
            minlength: 5
        },
        confirm_token: {
            required: true,
            minlength: 5,
            equalTo: "#token"
        }
    },
    messages: {},
    submitHandler: function(form) {
        alert("submitted");
    }
});
});//]]>

</script>
</head>
<body>
  <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js" type="text/javascript"></script>
<form class="cmxform" id="tokenval" method="get" action="">
    <fieldset>
        <legend>Validating a complete form</legend>
        <p>
            <label for="token">token</label>
            <input id="token" name="token" type="text" />
        </p>
        <p>
            <label for="confirm_token">Confirm token</label>
            <input id="confirm_token" name="confirm_token" type="text" />
        </p>
        <p>
            <input class="submit" type="submit" value="Submit" />
        </p>
    </fieldset>
</form>
</body>
</html>

謝謝你的幫助

Answer 1

好的，讓我們看看該FIDDLE是否滿足您的要求。

“真實”令牌是xxxxx。

任何令牌的格式均為五個字符。 該代碼去除了前導零和尾隨零。

因此，您可以從xxxxx開始並觀察會發生什么。

然后是xxx。

然后rrr

然后rrrrr。

JS

var validtoken = "xxxxx";

$('#checkme').click(function(){
     $('#messagediv').html('');
     var firsttoken = $('#token1').val();
     firsttoken = firsttoken.trim();

    if( firsttoken.length !== 5)
      {
       $('#messagediv').html('The token has an incorrect format<br /> Please reenter');
       $('#token1').val('');    
       } else {
                if (firsttoken == validtoken)
                  {
                   $('#messagediv').html('Your token exists<br /> click PROCEED for the next step');
                   $('.proceed').css('display', 'block');
                   } else {
                   $('.errordiv').css('display', 'block');
                           }
               }
                             A});

$('#proceed').click(function(){
  $('#token1').val('');     
  $('.proceed').css('display', 'none');
  $('#messagediv').html('');
  alert('And the next step is....');
                                });

$('#confirm').click(function(){
  var confirmtoken1 = $('#token1').val();
  var confirmtoken2 = $('#token2').val();

  if(confirmtoken1 == confirmtoken2)    
    { $('#token1').val('');  
      $('#token2').val('');      
      $('.proceed').css('display', 'none');
      $('#messagediv').html('');
      alert('Confirmed. And the next step is....');
    } else {
            $('#token1').val('');  
            $('#token2').val('');      
            $('.proceed').css('display', 'none');
            $('.errordiv').css('display', 'none');
            $('#messagediv').html('tokens do not match. Reenter');
           }
                              });

如何檢查用戶記錄的可用性，如果可用，請重新輸入以確保安全性？

問題描述

1 個解決方案

解決方案1
0 2014-02-28 20:10:21

如何檢查用戶記錄的可用性，如果可用，請重新輸入以確保安全性？

問題描述

1 個解決方案

解決方案1 0 2014-02-28 20:10:21

解決方案1
0 2014-02-28 20:10:21