Question

我有这个html表格

<form action="upload/" id="upload" name="upload">
// other form data
</form>

并在页面上的html中我可以切换表单属性

<a href="#" id="startDownload">Download</a>
<a href="#" id="startUpload">Upload</a>

和我的javascript

$("#startUpload").click(function( {
    $("form").attr('action','upload/').attr('id','upload');
});

$("#startDownload").click(function( {
    $("form").attr('action','download/').attr('id','download');
});

$(function() {
    $('#upload').uploadThis({
        // other code here
    });
$(function() {
    $('#download').downloadThis({
        // other code here
    });

我的问题是当我点击href #startUpload这附加了$（'#upload'）。uploadThis（{}）函数并且它有效但是当我点击#startDownload时它没有附加这个$（'＃上传'）。下载此（{}）函数而不是被调用。

感谢您的帮助。

Answer 1

我不确定所需的行为究竟是什么，但更改元素的ID总会带来同样的问题。

你这样做：

$(function() {
    $('#upload').uploadThis({
        // other code here
    });
});

$(function() {
    $('#download').downloadThis({
        // other code here
    });
});

$(<Function>);是$(document).ready(<Function>);

的简写

问题在于，当您准备好文档时，它会在当时但之上执行您的处理程序，只有ID #upload存在的元素， $('#download')实际上是一个空的选择。

在更改ID后，您可以在各自的$('#upload').uploadThis()处理程序中致电$('#download').downloadThis()和.click()。

$("#startUpload").click(function( {
    $("form")
       .attr({ 'action': 'upload/', 'id': 'upload' })
       .uploadThis(...);
});

注意：如果这些是您自己编写的插件，请确保每次调用它们时都不会初始化。

希望我足够清楚：o）

Answer 2

您可以根据需要多次执行此操作：

$("#startDownload").bind('click', function() {
    ...
});

Answer 3

你试图在元素存在之前绑定元素......永远不会工作。

$("#startUpload").click(function( {
    $("form").attr('action','upload/').attr('id','upload').submit(function() {
        $(this).uploadThis({
            //other code here
        });
    );
});

$("#startDownload").click(function( {
    $("form").attr('action','download/').attr('id','download').submit(function() {
        $(this).downloadThis({
            //other code here
        });
    );
});

这样您就可以在提交表单事件中绑定所需的操作。可能会解决你的问题。

Answer 4

一种简单的方法是为表单创建自定义事件并通过onclick来触发它们：

$("#startUpload").click(function( {
    $("form").trigger('upload');
});
$("#startDownload").click(function( {
    $("form").trigger('download');
});

$("form").bind('upload',function(){
    $(this).attr('action','upload/').uploadThis();
}).bind('download',function(){
    $(this).attr('action','download/').downloadThis();
});

使用jquery在表单中附加2个函数

4 个答案: