Question

选择要上传的文件时，将触发以下脚本。如果根据数据查找，所选图像文件的宽度和高度不正确，则会显示警报。在使用Bootstrap重装我的网站之前，只需使用Jquery即可。现在我介绍了Bootstrap，但出现了以下错误：

未捕获的TypeError：$ .alert不是第24行上的函数

window.URL    = window.URL || window.webkitURL;
var elBrowse  = document.getElementById("browse"),
elPreview = document.getElementById("preview4"),
elPreviewtext = document.getElementById("previewtext"),
useBlob   = false && window.URL;

function readImage (file) {
  // Create a new FileReader instance
  var reader = new FileReader();
  // Once a file is successfully readed:
  reader.addEventListener("load", function () {
    var image  = new Image();
      image.addEventListener("load", function () {
      // Concatenate our HTML image info
      var imageInfo = file.name;
      if ( image.width != w && image.height != h ) {
        $.alert({ ///////// LINE 24 /////////
          title: 'Image select error!',
          content: 'The image you have seleted is incorrect, ' + image.width + ' by ' + image.height + ' portrate.<br/><br/> Please resize your image to the correct size in landscape.<br/><br/>Resizing upwards reduces the quality of the image. Start with a large image and resize downwards.<br/><br/>For help read section 1.5 in the knowledgebase',
          icon: 'fa fa-rocket',
          animation: 'zoom',
          boxWidth: '50%',
          closeAnimation: 'zoom',
          buttons: {
            okay: {
              text: 'Try again',
              btnClass: 'btn-blue'
            }
          }
        });

       } else {
             var imageInfotext = 'Display width: '+ image.width  +',<br/>Display height: '+ // But get the width from our `image`
         image.height;

          // Finally append our created image and the HTML info string to our `#preview`
          elPreview.appendChild( this );
          elPreview.insertAdjacentHTML("beforeend", imageInfo +'<br>');
          elPreviewtext.insertAdjacentHTML("beforeend", imageInfotext +'<br>');
              if (useBlob) {
            // Free some memory for optimal performance
            window.URL.revokeObjectURL(image.src);
          }
        }
      });
    image.src = useBlob ? window.URL.createObjectURL(file) : reader.result;
});
reader.readAsDataURL(file);
}
// Once the user selects all the files to upload
// that will trigger a `change` event on the `#browse` input
elBrowse.addEventListener("change", function() {
var files  = this.files;
var errors = "";
if (!files) {
errors += "File upload not supported by your browser.";
}
// Check for `files` (FileList) support and if contains at least one file:
if (files && files[0]) {

// Iterate over every File object in the FileList array
for(var i=0; i<files.length; i++) {

// Refer to the current File as a `file` variable

var file = files[i];

// Test the `file.name` for a valid image extension:
// (pipe `|` delimit more image extensions)
// The regex can also be expressed like: /\.(png|jpe?g|gif)$/i
if ( (/\.(png|swf|jpg)$/i).test(file.name) ) {
// SUCCESS! It's an image!
// Send our image `file` to our `readImage` function!
readImage( file );
} else {


$('#imageis').hide();
$.alert({
title: 'Image select error!',
content: 'Unsupported Image extension, ' + file.name + '.<br/><br/> Supported file extensions are:.<br/><br/>.png for an image file<br/>.swf for a Adobe Flash file',
icon: 'fa fa-rocket',
animation: 'zoom',
boxWidth: '50%',
closeAnimation: 'zoom',

buttons: {
okay: {
text: 'Try again',
btnClass: 'btn-blue'
}
}
});

}
}
}
});

非常感谢您的宝贵时间。

Answer 1

我对名为$.alert()的方法并不熟悉，因此稍后进行了研究，我认为您的代码打算使用这种格式：

$(".close").click(function(){
   $("#myAlert").alert("close");
});

或者，也许您使用的是您未提及的jQuery插件。

您似乎正在使用jQuery确认插件-正确吗？指向该插件代码的HTML链接是否发生了任何事情？（那 会导致这样的错误... ）

jQuery和引导程序模式未捕获的TypeError：$ .alert不是函数

1 个答案: