Question

我正在尝试检查输入密钥的某些条件。为此我编写了一些代码但该代码也执行了一些其他代码。我试过但没找到问题发生的原因。就像我有文本字段，我正在使用ajax字符搜索加载数据，现在我正在尝试添加新的条件，如果按下输入键检查字段并做一些工作。但它检查并发送表单而不单击我的提交按钮。我很困惑为什么会发生这种情况。以下是我的代码：

jQuery(function(){
    jQuery("#name").keyup(function(event) 
    { 
        // this is code to check whether enter key is pressed or not
        if(event.keyCode == 13){
            if(jQuery('#name').val()==''){
                alert("Please select Product name First.")
                jQuery('#name').focus();
                jQuery('#name').css('border','1px solid red');
            }else{ 
                // jQuery('#checkpname').click();
                changetab('step2'); // I want to stop code after this
            }
        // this is code to check whether enter key is pressed or not
        }else{ 
            var searchid = jQuery(this).val();
            var dataString = 'search='+ searchid;
            if(searchid!='')
            {
                jQuery.ajax({
                    type: "POST",
                    url: '<?php echo Mage::helper('core/url')->getHomeUrl();?>pmembers/packages/searchproducts/key/e0603b30a8d5802f6df3jhyd87f31ddb/',
                    data: dataString,
                    cache: false,
                    success: function(html) {
                        jQuery("#result").html(html).show();
                    }
                });
            }   
        }
    });
    //jQuery('body').on('click', '#result',function(e){
    jQuery("#result").live("click",function(e){ 
        var $clicked = jQuery(e.target);
        // var $name = $clicked.find('.name').html();
        //var decoded = jQuery("<div>").html($name).text();
        jQuery('#name').val(jQuery(e.target).text());
    });
    jQuery(document).on("click", function(e) { 
        var $clicked = jQuery(e.target);
        if (! $clicked.hasClass("search")){
            jQuery("#result").fadeOut(); 
        }
    });
    jQuery('#name').click(function(){
        jQuery("#result").fadeIn();
    });
});

这是changetab功能：

function changetab(hrf){
    jQuery('a.btn').each(function () {
    jQuery(this).click(function () {
      //var thisid = $('#sell .tab-pane.active').attr('id');
      jQuery('.wizard a[data-toggle="tab"]').removeClass('current');
      jQuery('.wizard a[href="#'+hrf+'"]').click();
    });
  });
}

此功能基本上可以更改标签。我只想检查文本字段，如果不为空则输入，然后加载第二个选项卡。选项卡功能在其他条件下正常工作只输入创建问题。希望有人理解我想说的话。提前致谢

Answer 1

尝试在keycheck函数中添加event.preventDefault（），这会阻止其实际功能并按照您的说法进行操作。

尝试使用event.stopPropagation（）并告诉我

<强>已更新

if(event.keyCode == 13){
     event.stopPropagation();
    if(jQuery('#name').val()==''){
    alert("Please select Product name First.")
    jQuery('#name').focus();
    jQuery('#name').css('border','1px solid red');

   }else{ 

  // jQuery('#checkpname').click();
    changetab('step2'); // I want to stop code after this
      return false;
   }

随时随地添加。检查以下链接是否具有正确的功能

PreventDefault

Answer 2

首先，您应该处理密钥事件。但你不是。尝试：

if(event.keyCode == 13){
    event.preventDefault();
    if(jQuery('#name').val()==''){
        alert("Please select Product name First.")
        jQuery('#name').focus();
        jQuery('#name').css('border','1px solid red');
    }else{ 
        // jQuery('#checkpname').click();
        changetab('step2'); // I want to stop code after this
    }
    // I always return a false and never trust preventDefault
    return false;
// this is code to check whether enter key is pressed or not
}else{ /* rest of code */

并且：我记得，你可以在keydown事件上处理密钥事件，而不是keyup。所以试试吧。它应该工作。

jQuery("#name").keydown(function(event){ /* rest of your code... */

Js在输入键事件时创建问题

2 个答案: