为什么我的jQuery / Javascript函数没有被正确调用onsubmit？

问题描述

我有这个jQuery函数，使用另一个jQuery库html5csv.js（它解释了一些CSV的东西，你会看到）

I have this jQuery function that is using another jQuery library called html5csv.js (which explains some of the CSV stuff you will see)

这里是： / p>

Here is it:

function validateNewQuiz()
{
    CSV.begin("#upload_csv").go(function(e,D)
    {
        if (e)
        {
            return console.log(e);
            alert("Sorry, an error occured");
        }

        var s = "";


        for (var i = 0; i <= D.rows.length - 1; i++)
        {
            s +=D.rows[i].join(',');
            s += "\n";
        }

        var fullString = s;

        if(/^(([^,]+,){4}[^,]+\n){3}$/.test(fullString))
        {
            return true;
        }
        else
        {
            return false;
        }

    });
}

这是我试图调用我的函数，从 onsubmit ：

Here is how I am trying to call my function, from an onsubmit within my form:

<form method="post" action="createplay.php" onsubmit="return validateNewQuiz();" enctype="multipart/form-data">

我的函数已经过彻底测试，我的正则表达式，以确保它的工作。当我决定将它实现到我的大文档，并包装在函数validateNewQuiz（）{//我的函数这里} ，它停止工作。

My function has been thoroughly tested, along with my regex to make sure it was working. When I decided to implement it into my large document, and wrap it around function validateNewQuiz(){ //my function here } , it stopped working.

我没有使用我的表单中的onsubmit部分进行测试。

I did not make my tests with the onsubmit part within my form either.

我尝试了两种方法。一种方法是这样，将它们分成两个函数：

I tried fixing it two ways. One way was like this, splitting them into two functions:

var fullString = "";
CSV.begin("#upload_csv").go(function(e,D)
{
    if (e)
    {
        return console.log(e);
        alert("Sorry, an error occured");
    }

    var s = "";


    for (var i = 0; i <= D.rows.length - 1; i++)
    {
        s +=D.rows[i].join(',');
        s += "\n";
    }

    fullString = s;
});


function validateNewQuiz()
{
    if(/^(([^,]+,){4}[^,]+\n){3}$/.test(fullString))
    {
        return true;
    }
    else
    {
        return false;
    }
}

第二种方法是添加 return 以外的CSV部分：

And the second way, by added the return outside of the CSV part:

var fullString = "";
function validateNewQuiz()
{
    CSV.begin("#upload_csv").go(function(e,D)
    {
        if (e)
        {
            return console.log(e);
            alert("Sorry, an error occured");
        }

        var s = "";


        for (var i = 0; i <= D.rows.length - 1; i++)
        {
            s +=D.rows[i].join(',');
            s += "\n";
        }

        fullString = s;
    });

    if(/^(([^,]+,){4}[^,]+\n){3}$/.test(fullString))
    {
        return true;
    }
    else
    {
        return false;
    }
}

任何人都有任何建议，提交，即使我的函数应该返回 false ？

Does anyone have any suggestions to why my form is always submitting, even when my function should be returning false?

这是我试图做的另一个编辑，它仍然提交到我的PHP和控制台消息没有显示，因为该页面提交到PHP，因此重新加载

Here is another edit that I tried to make, although it is still submitting to my PHP and the console messages are not being displayed since that page is being submitted to PHP, therefore reloading

jQuery("#newQuizID").click(function(e)
{
    e.preventDefault();

    CSV.begin("#upload_csv").go(function(e,D)
    {
        if (e)
        {
            return console.log(e);
            alert("Sorry, an error occured");
        }

        var s = "";


        for (var i = 0; i <= D.rows.length - 1; i++)
        {
            s +=D.rows[i].join(',');
            s += "\n";
        }

        var fullString = s;

        if(/^(([^,]+,){4}[^,]+\n){3}$/.test(fullString))
        {
            console.log("Working");
            jQuery("#form-step2").submit();
        }
        else
        {
            console.log("Not Working");
        }

    });
});

推荐答案

html5csv会在文件输入上放置事件处理程序只有在添加文件时才会触发，因此您需要在某处设置有效标志，然后在提交之前检查

html5csv puts a event handler on the file input so it only triggers when a file is added so you need to set a valid flag somewhere and then check it before submitting

function checkValidCSV(e) {
    var isValid = jQuery("#form-step2").data("hasValidData");
    if( typeof(isValid) != "undefined" && isValid ) {
        jQuery("#form-step2").submit();
    } else {
        //Do whatever invalid data cals you want to do here
        alert("csv file was invalide so i am not submitting the form");
        e.preventDefault();
    }
}

function csvFileLoaded(e,D) {
    if (e) {
        return console.log(e);
        alert("Sorry, an error occured");
    }

    var s = "";
    for (var i = 0; i <= D.rows.length - 1; i++) {
        s +=D.rows[i].join(',');
        s += "\n";
    }
    var fullString = s;
    if(/^(([^,]+,){4}[^,]+\n){3}$/.test(fullString)){
        console.log("Valid Data");
        jQuery("#form-step2").data("hasValidData",true);
    } else {
        console.log("Invalid Data");
        jQuery("#form-step2").data("hasValidData",false);
    }
}

jQuery(document).ready(function() {
    CSV.begin("#upload_csv").go(csvFileLoaded);
    jQuery("#newQuizID").click(checkValidCSV);
});

这篇关于为什么我的jQuery / Javascript函数没有被正确调用onsubmit？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！