Jquery 更改事件触发两次而不是一次
我正在开发这个html5文件上传插件,但它有一个我无法理解和修复的bug 这个插件的想法是只在点击目标按钮时才将一组功能附加到该按钮 但是,当我点击'button-1'点击事件时,'button-2'点击事件在发生Jquery 更改事件触发两次而不是一次,jquery,html,jquery-plugins,onchange,Jquery,Html,Jquery Plugins,Onchange,我正在开发这个html5文件上传插件,但它有一个我无法理解和修复的bug 这个插件的想法是只在点击目标按钮时才将一组功能附加到该按钮 但是,当我点击'button-1'点击事件时,'button-2'点击事件在发生更改事件时被触发。我认为变革事件一定触发了两次 你可以试着点击上传按钮,看看我的意思 你知道这个插件出了什么问题吗 (function($){ // Attach this new method to jQuery $.fn.extend({ /
更改事件时被触发。我认为变革事件一定触发了两次
你可以试着点击上传按钮,看看我的意思
你知道这个插件出了什么问题吗
(function($){
// Attach this new method to jQuery
$.fn.extend({
// This is where you write your plugin's name
upload_file_html5: function(options) {
// Set the default values, use comma to separate the settings, example:
var defaults = {
objectSuperparent: '.media'
}
var options = $.extend(defaults, options);
var o = options;
var $cm = this.click(function(e){
// <a> button is the object in this case.
var object = $(this);
// Get other info from the element belong to this object group.
var object_href = object.attr('href');
var object_parent = object.parent();
alert($cm.selector);
// Trigger the click event on the element.
// Due to security policies triggering click on the input type=file is not allowed/supported in some browsers and Opera is one of them.
//$('input[type=file]').trigger('click'); // or:
$(".upload-file",object_parent).click();
return false;
});
// Trigger ajax post when ever the file is changed by the user.
var $cm_2 = $(".upload-file").change(function(){
// <input> is the object in this case.
var object = $(this);
var object_form = object.parent();
var object_superparent = object.parents(o.objectSuperparent);
var path_config = $($cm.selector,object_superparent).attr('href');
var path_post = object_form.attr('action');
alert($cm.selector);
//alert(path_config);
....
....
});
}
});
})(jQuery);
(函数($){
//将此新方法附加到jQuery
$.fn.extend({
//这是你写插件名称的地方
上传文件html5:功能(选项){
//设置默认值,使用逗号分隔设置,例如:
var默认值={
objectSuperparent:“.media”
}
var options=$.extend(默认值,选项);
var o=期权;
var$cm=此。单击(函数(e){
//按钮是本例中的对象。
var object=$(这个);
//从属于此对象组的元素获取其他信息。
var object_href=object.attr('href');
var object_parent=object.parent();
警报(厘米选择器);
//触发元素上的单击事件。
//由于安全策略,在某些浏览器中不允许/不支持单击输入类型=文件,Opera就是其中之一。
//$('input[type=file]')。触发器('click');//或:
$(“.upload file”,对象\父对象)。单击();
返回false;
});
//当用户更改文件时触发ajax post。
var$cm_2=$(“.upload file”).change(函数(){
//是本例中的对象。
var object=$(这个);
var object_form=object.parent();
var object\u superparent=object.parent(o.objectSuperparent);
var path_config=$($cm.selector,object_superparent).attr('href');
var path_post=object_form.attr('action');
警报(厘米选择器);
//警报(路径配置);
....
....
});
}
});
})(jQuery);
检查我的代码变体:
基本jQuery插件结构:
$.fn.pluginName = function() {
return this.each(function() { // <-- this is important
// code here
});
};
$.fn.pluginName=function(){
返回此。每个(function(){//非常感谢您的回答,dfsq。但是如何使用alert-alert($cm.selector);
?这是您当前的DOM对象,$(this),获取/返回所单击按钮的名称(即.button-1
)对应jQuery对象。但您最好不要依赖选择器,因为它可以是任何对象。例如:#button1
,.button1
,#some>。button:first
,等等。感谢dfsq.jsfiddle.net/es8Vh/5提醒每个按钮,但我只想提醒单击的按钮-可能吗?