Question

创建动态表后，我创建了一个jQuery函数，允许用户通过按钮将所选条目的输入值复制到临时区域。这些值已成功克隆，但在每次单击按钮后，会出现欧芹验证错误消息

“此值应为有效整数。”

表中的每个输入都会出现

。为什么验证会将无效数字输入到输入中，以及如何避免此错误消息？

此外，还有一个按钮可将一组输入复制到暂存区域，然后在单击之后，不会显示欧芹验证错误消息。任何人都可以看到为什么单个副本会生成验证消息而组副本不会？我看到的唯一区别是，当单击一个类成员而不是一个ID时，将调用验证触发代码：1）;和2）使用.closest()，.children()和.eq()方法导航表，而不是仅使用ID来引用表元素。非常感谢提前！

在AJAX调用之后循环中创建动态表行：

var row = $('<tr></tr>');

var idCell = $('<td></td>').append($('<input type="submit" class="btn btn-info contractToOffer" value="Add To Contracts">'));
row.append(idCell);

idCell = $('<td class="text-center" id="contractID' + data[i].ContractID + '"></td>').append(data[i].ContractID);
row.append(idCell);

idCell = $('<td class="text-center"></td>').append(Number(Number(data[i].ContractPrice) + Number(data[i].ContractMargin)).toFixed(2));
row.append(idCell);

idCell = $('<td class="text-center"><input id="contractValue' + data[i].ContractID + '" value="' + Number(Number(data[i].ContractPrice) + Number(data[i].ContractMargin)).toFixed(2) + '" step="0.01" class="contractInput" type="number" name="quantity" min="1" max="50000"></td>').append();
row.append(idCell);

生成验证消息的移动函数：

$("#contractPanel").on("click", ".contractToOffer", function () {
    var $offerContractOne = $("#OfferContract1"),//In staging area
        $offerPriceOne = $(".price1"),//Also in staging area
        $movingContract = 0,
        $movingPrice = 0.00,
        $oCells = $(this).closest('tr').children('td');

    $movingContract = $oCells.eq(1).text();
    $movingPrice = $("#contractValue" + $movingTerm.toString()).val();
    $offerContractOne.val($movingTerm);//Staging area
    $offerPriceOne.text($movingPrice);//Also staging area
});

最后，通过“standardOffers”按钮复制不会生成任何消息的组，我也想要单拷贝代码：

$("#contractPanel").on("click", "#standardOffers", function () {
    var $oContractOne = $("#OfferContract1"),
        $oPriceOne = $(".price1"),
        $oContractTwo = $("#OfferContract2"),
        $oPriceTwo = $(".price2"),
        $oContractThree = $("#OfferContract3"),
        $oPriceThree = $(".price3"),
        $oContractFour = $("#OfferContract4"),
        $oPriceFour = $(".price4"),
        $oContractFive = $("#OfferContract5"),
        $oPriceFive = $(".price5"),
        //The preceding are in the staging area
        $standardPrice = 0.00

    for (var i = 1; i < 6; i = i + 1) {
        if ($("#contractID" + i).length > 0) {
            $standardPrice = $("#contractValue" + i.toString()).val();
            if (i == 1) {
                $oContractOne.val(i.toString());
                $oPriceOne.text($standardPrice);
            }
            else if (i == 2) {
                $oContractTwo.val(i.toString());
                $oPriceTwo.text($standardPrice);
            }
            else if (i == 3) {
                $oContractThree.val(i.toString());
                $oPriceThree.text($standardPrice);
            }
            else if (i == 4) {
                $oContractFour.val(i.toString());
                $oPriceFour.text($standardPrice);
            }
            else {
                $oContractFive.val(i.toString());
                $oPriceFive.text($standardPrice);
            }
        }
    }
});

Answer 1

建立在我的评论之上：

您有两个选择：

event.preventDefault();

这将：

如果事件可以取消，则取消该事件，而不会停止事件的进一步传播。

Source

第二选项：

event.stopPropagation();

这将：

防止当前事件在捕获和冒泡阶段进一步传播。

Source

通过jQuery检索输入后触发Parsley.js验证错误

1 个答案: