如何创建表单以生成 URL

how to create a form to generate url

本文关键字:URL 表单 何创建 创建      更新时间:2023-09-26

我的网站上有一个表单来生成 url,它运行良好,但用户应该等到整个页面加载才能正确使用它,我认为发生这种情况是因为我使用 window.onload,我应该使用 $(document(.ready 而不是它,但我无法替换它,我需要有人帮助我

<script type='text/javascript'>
   window.onload = function() {
   document.forms['filterform'].onsubmit = filterLoad;
};
function filterLoad() {
  var url,
      colourSel = this.elements['department'],
      shapeSel = this.elements['country'];
  url = ( colourSel.options[colourSel.selectedIndex].value ) + ( shapeSel.options[shapeSel.selectedIndex].value ); 
 window.location.href = url;
 return false;
}
</script>


<form   id="searchform" name="filterform">
   <select class="chosen" name="department" id="searchfield" >
      <option value="http://www.mysite.com/">choise 1</option>
      <option value="http://www.mysite.com/">choise 1</option>
   </select>
   <select class="chosen" name="country" id="choose">
      <option value="?qatar=show&action=Filter">qatar</option>
      <option value="?ksa=show&action=Filter">ksa</option>
   </select>
   <label for="search"><button  class="submit" onclick="filterLoad()"  /></button></label>
</form>

我会摆脱所有额外的javascript来分配函数,只使用:

<form   id="searchform" name="filterform" onsubmit="filterLoad">

您的想法是正确的,我会在提交表单时调用该函数,并从提交按钮中删除单击事件。

试试这个:

<script type='text/javascript'>
function filterLoad() {
  var url,
      colourSel = this.elements['department'],
      shapeSel = this.elements['country'];
      url = (colourSel.options[colourSel.selectedIndex].value) + (shapeSel.options[shapeSel.selectedIndex].value);
      window.location.href = url;
      return false;
}
</script>
<form id="searchform" name="filterform" onSubmit="return filterLoad();" >
   <select class="chosen" name="department" id="searchfield" >
      <option value="http://www.mysite.com/">choise 1</option>
      <option value="http://www.mysite.com/">choise 1</option>
   </select>
   <select class="chosen" name="country" id="choose">
      <option value="?qatar=show&action=Filter">qatar</option>
      <option value="?ksa=show&action=Filter">ksa</option>
   </select>
   <label for="search"><button  class="submit" /></button></label>
</form>