Question

我有一个HTML表单。我想获取输入值（网址），使用正则表达式( '/[0-9]{5,}/')从网址中提取数字，然后使用提取的数字刷新表单值并将其附加到另一个网址。如果我找不到数字 - 我只想在表单框中显示错误。全部使用Jquery来避免页面重新加载。

这是现有表格

 <form id = "submit" method="post">
  <label for="link_website_url">Create a short url</label>
  <input id="link_website_url" name="link" size="30" type="text" />
  <input class="go" name="commit" type="submit" value="Go!" /></form>

Answer 1

$('#submit').submit(function(){
  var url = $('#link_website_url').value();
  var val = <do your processing here>;
  $('#link_website_url').value(val);
  return false; 
});

Answer 2

$('#submit').submit(function(){
  var url = $('#link_website_url').val(); //http://example.com/12345
  var num = yourNumExtractorFunction(url); //returns -1 if there is no number extracted
  if(num > -1){
    $('#link_website_url').val('http://otherdomain.com/' + num); //http://otherdomain.com/12345
  }else{
    $('#link_website_url').after('<span id="error_link_web_url" class="error">Incorrect format! Please try again.</span>');
    return false; //error, so cancel this submit
  }
});

如果您执行其他验证，即使单个检查通过也取消提交，每个检查验证的清除错误消息（例如$（'＃error_link_web_url'）。remove（）;）并在所有检查通过后提交：

var checkFailed = false;
$('#submit').submit(function(){
  var url = $('#link_website_url').val(); //http://example.com/12345
  var num = yourNumExtractorFunction(url); //returns -1 if there is no number extracted
  if(num > -1){
    $('#link_website_url').val('http://otherdomain.com/' + num); //http://otherdomain.com/12345
    $('#error_link_web_url').remove();
  }else{
    $('#link_website_url').after('<span id="error_link_web_url" class="error">Incorrect format! Please try again.</span>');
    checkFailed = true;
  }

  /*Other checks...*/    

  if(checkFailed){
     return false; //cancel submit
  }
});

如何使用JQuery刷新表单值

2 个答案: