Question

我写了一个检查图像高度和宽度的函数。你可以在下面找到我的代码。它有效，但我遇到return false的问题：它不起作用。

$("#published").click(function( event ){
    var img = $('<img src="'+selectedImage+'"/>').load(function( event  ){
                  var orgWidth = this.width;
                  var orgHeight = this.height;
                  console.log(orgWidth+" = "+orgHeight);

                  if(orgWidth >= 169 && orgHeight >= 169){
                    thisValidate.parent('div.rwmb-input').children('.imageError').remove();
                    return true;
                  }else{
                    event.preventDefault();
                    if(thisValidate.parent('div.rwmb-input').children('.imageError').length == 0){
                      thisValidate.parent('div.rwmb-input').append("<p class='imageError'></p>");
                    }
                    thisValidate.parent('div.rwmb-input').children('.imageError').html('<br/><label for="techranger_booked_feature_images" class="error">Upload Image More then 169 x 169</label>');
                    return false;
                  }
              });

});

我添加了event.preventDefault();，但也没有帮助。

Answer 1

您将返回load()函数，该函数不会返回外部点击功能。

此外load()是异步的，因此点击事件将在load()之前很久完成。

最后，您有2个event个参数，load内的参数不会对点击产生任何影响

您需要完全阻止点击，并在load()成功后手动触发下一个事件。

$("#published").click(function( event ){
     event.preventDefault();// prevent default
    // no access to "this" inside load() so store reference to form
    var $form = $(this).closest('form');

    var img = $('<img src="'+selectedImage+'"/>').load(function(imgEvt ){
           // code removed for clarity
          if(orgWidth >= 169 && orgHeight >= 169){
               /* trigger form submit */
               $form.submit();
          }else{
             // other code
          }
    });
});

Answer 2

首先，您的return false正在为load事件提供服务的函数范围内运行，而event是jQuery load函数的事件

其次，如果您想在按钮上执行此操作，则不能像尝试那样同步执行此操作，因为获取图像的请求是异步的，因此在按钮上的功能后发生事件已完成（因此您无法停止事件默认行为，因为它已经发生）。无论图像大小如何，您都必须在click方法中阻止/返回false，然后在检查（un - ？）成功后再调用另一个函数。这是唯一的方法。

$("#published").click(function(event){
  // here your check, e.g. if (imageFits) goOnFunction();

  event.preventDefault();
});

最后你absolutely do not need jQuery here：

var myImage = new Image();

myImage.src = 'http://okolo.me/wp-content/uploads/2015/07/5998.jpg';

myImage.onload = function() {
    // here you can use myImage.width and myImage.height
};

jQuery Image load（）事件返回false不起作用？

2 个答案: