javascript setCustomValidity在我的上下文中不起作用

Question

我有以下用于自定义验证的代码段：

var discountPirces = document.querySelectorAll('.sale-discounted-price input');
for(i=0;i<discountPirces.length;i++)
{
    element = discountPirces[i];
    // if discounted price is more than original price
    if(parseInt(element.value) > parseInt(element.getAttribute('max')))
    {
        element.setCustomValidity('Discounted Price is more than original price');
    }
    // id discounted price falls below 0
    else if(parseInt(element.value) <0)
    {
       element.setCustomValidity('Discounted Price couldnot be less than zero');
    }
    else
    {
       element.setCustomValidity('');
    }
 }

此表格用于销售产品，并允许销售人员设定价格。我需要HTML5验证错误并阻止用户提交表单。如果我放置alert();而不是element.setCustomValidity()弹出窗口。我不想让警告框显示错误..

JSFiddle链接是 - link for form