js的前台验证

最新推荐文章于 2022-03-06 12:49:39 发布

IMAGSE

最新推荐文章于 2022-03-06 12:49:39 发布

阅读量936

点赞数

文章标签： button input function border table

本文介绍了一个使用HTML和JavaScript实现的表单，该表单能够动态添加和删除行，并对每行中的品牌名称、数量及日期进行前端验证。具体而言，品牌名称必须为中文且不含逗号，数量字段必须为数字，而日期则需符合特定格式。

摘要由CSDN通过智能技术生成

< script >
function    deleteLine()
{
for    ( var    i = tbody1.children.length - 1 ;   i >= 0    ;   i --    )
if    (tbody1.children[i].firstChild.firstChild.checked)
tbody1.deleteRow(i);
}
function    addLine()
{
elm   =    thead1.lastChild.cloneNode( true )
elm.style.display = " block " ;
tbody1.insertBefore(elm);
}

function check(f){
    var row,cell
    for ( var i = 0 ;i < tbody1.rows.length;i ++ ){
      row = tbody1.rows[i];
      o = row.cells[ 1 ].firstChild;
      if ( ! / [/u4e00-/u9fa5] / g.test(o.value) || / [,，] / g.test(o.value)){
        alert( ' 品牌请输入中文并且不能含逗号！ ' );
        o.focus();
        return false ;
      }
      o = row.cells[ 2 ].firstChild;
      if (o.value == "" || isNaN(o.value)){
        alert( ' 数量为数量！ ' );
        o.focus();
        return false ;
      }
      o = row.cells[ 3 ].firstChild;
      if ( ! / ^/d{4}-/d{1,2}-/d{1,2}$ / .test(o.value)){
        alert( ' 时间格式为2008-10-17，格式不正确！ ' );
        o.focus();
        return false ;
      }
    }
}
< / script>

< form method = " post " onsubmit = " return check(this) " >
< TABLE cellSpacing = 1 cellPadding = 0 width = " 400 " bgColor = #cccccc border = 0 >< TBODY >
< thead   id = thead1 >
      < TR bgColor = #f5f5f5 height = 25 >
        < td height = " 30 " colspan = " 4 " > 行是动态增减, 文本框对应的要求是
        1 .输入中文,不能含有逗号
        2 .数值3.日期 .请高手告知js的前台验证. 万分感激:) < / td>
      < / tr>
      < TR bgColor = #f5f5f5 height = 25 >
        < td width = " 38 " height = " 30 " align = " center " > 选中 < / td>
        < td width = " 163 " > 品牌(中文不能有,号) < / td>
        < td width = " 82 " > 数量(数值) < / td>
        < td width = " 112 " > 要求时间(日期) < / td>
      < / tr>
      < TR bgColor = #ffffff height = 25 style = " display:none " >
        < td height = " 25 " >< input   type = checkbox   id = checkLine >< / td>
          < td >< INPUT   name = brand id = " brand "    size = 10 maxlength = " 50 " >< / td>
          < td >< INPUT   name = amount id = " amount "    size = 6 maxlength = " 20 " >< / td>
          < td >< INPUT   name = datelimit id = " datelimit " size = 12 maxlength = " 50 " >< / td>
      < / tr>
< / thead>
< tbody id = tbody1 >
     < TR bgColor = #ffffff height = 25 >
        < td height = " 25 " >< input   type = checkbox   id = checkLine >< / td>
          < td >< INPUT   name = brand id = " brand "    size = 10 maxlength = " 50 " >< / td>
          < td >< INPUT   name = amount id = " amount "    size = 6 maxlength = " 20 " >< / td>
          < td >< INPUT   name = datelimit id = " datelimit " size = 12 maxlength = " 12 " >< / td>
      < / tr>
< / tbody>
      < TR bgColor = #ffffff height = 25 >
        < td height = " 25 " colspan = " 4 " >& nbsp; & nbsp;
          & nbsp; & nbsp; & nbsp;
          < input name = " button2 " type = button   onclick = " addLine() "    value = 添加 / >
          & nbsp; & nbsp;
          < input name = " button4 "    type = button   onclick = " deleteLine() "    value = 删除 / >
          & nbsp; & nbsp;
          < input name = " button4 "    type = submit value = 提交 / >< / td >
      < / tr>
< / table>
< / form>