输入框中的字符计数脚本有问题。当它达到最大级别时,我调用一个 ajax 函数,它第一次工作,但是当我在此输入框中第二次输入时,ajax 调用和 keyup 事件不起作用,我的代码如下:
.HTML
<div class="row-fluid hide payment_mode_card">
<input type="text" name="card_number" id="card_number" alt="cc" placeholder="Credit card number" class="required number xlarge span12" />
</div>
脚本
var xTriggered = 0;
$('#card_number').live('keyup',function(event) {
if (event.which == 6) {
event.preventDefault();
}
xTriggered++;
if(xTriggered == 6){
var action = "chkcard";
var cardNum = $("#card_number").val();
//alert(cardNum);
$.ajax({
url: "/{$current_folder}/check_card_type.{$CONFIG.site.file.extension}",
type: "post",
data: { "cardNum" : cardNum, "action":action},
success: function(debit_or_credit){
var dataObj = JSON.parse(debit_or_credit);
alert('This is a '+dataObj.debit_or_credit+' Card of '+dataObj.card_type+' type');
},
error: function(){
alert('There is an error');
}
});
}
})
和 PHP:
if($_POST['action']=='chkcard'){
$firstSixChr = substr($_POST['cardNum'], 0, 6);
$debit_or_credit = Salucro_payment::GetDebitOrCredit($firstSixChr);
/*echo "<pre>";
print_r($debit_or_credit);
$debit_or_credit = $debit_or_credit[debit_or_credit];
echo $card_type = $debit_or_credit[card_type];*/
echo json_encode( $debit_or_credit );
}
任何帮助将不胜感激。
试试这个...
var xTriggered = 0;
$('#card_number').on('keyup',function(event) {
var cardNum = $(this).val();
if (cardNum.length == 6){
var action = "chkcard";
$.ajax({
url: "/{$current_folder}/check_card_type.{$CONFIG.site.file.extension}",
type: "post",
data: { "cardNum" : cardNum, "action":action},
success: function(debit_or_credit){
var dataObj = JSON.parse(debit_or_credit);
alert('This is a '+dataObj.debit_or_credit+' Card of '+dataObj.card_type+' type');
},
error: function(){
alert('There is an error');
}
});
})
它使用cardNum.length
来确定何时进行 ajax 调用,而您之前正在计算按键次数,这是一种糟糕的方法。
我还live()
改为on()
. Live 在 jQuery v1.7 中被弃用。 on()
您现在应该使用的方法:)
您可以将其用作字符计数器脚本,然后在适用时应用 AJAX。这是字符计数器和输入限制器的完美工作示例
http://www.a100websolutions.in/character-counter-script-using-jquery/