手机浏览 RSS 2.0 订阅 膘叔的简单人生 , 腾讯云RDS购买 | 超便宜的Vultr , 注册 | 登陆

通过JS更改FORM的action

首页 > Javascript >

有时候我们不得不通过更改form的action来进行提交数据。当然大多数情况下,我们都是通过隐藏的字段来使action得到不同的数据。比如我们form的action是search.php,那么我们都是通过隐藏字段来使我们通过search.php搜索不同值,比如<input type="hidden" name="action" value="article">然后在search.php里面通过$_POST['action']=='article'来知道我们搜索的内容是文章而不是其他。

但如果我们搜索页面并非只有一个入口search.php怎么办?比如我们的全文搜索是search.php,搜索文章是search_article.php,搜索新闻是search_news.php。怎么办?当然我们可以通过下拉框的值来更改FORM的action,就可以了。

简单代码如下,

XML/HTML代码
  1. <script type="text/javascript">  
  2. <!--  
  3.     function redirectForm( which ){  
  4.         var searchModeList = document.getElementById('searchMode');  
  5.         var actionFile = '';  
  6.         for (var i=0,sml=searchModeList.length; i<sml ; i++ ){  
  7.             if( i == searchModeList.selectedIndex ){  
  8.                 actionFile = searchModeList[i].value;  
  9.             }  
  10.         }  
  11.         if( actionFile == ''){  
  12.             return false;  
  13.         }else{  
  14.             actionFileactionFile = actionFile + '.php';  
  15.         }  
  16.         which.action = actionFile;  
  17.         which.submit();  
  18.     }  
  19. //-->  
  20. </script>  
  21. <form method="post" action="" onsubmit="return redirectForm(this);" id='searchForm'>  
  22.     <select id="searchMode">  
  23.         <option value="search" selected="selected">Default</option>  
  24.         <option value="search_article" >Article</option>  
  25.         <option value="search_news">News</option>  
  26.     </select>  
  27.     <input type="submit" />  
  28. </form>  




本站采用创作共享版权协议, 要求署名、非商业和保持一致. 本站欢迎任何非商业应用的转载, 但须注明出自"易栈网-膘叔", 保留原始链接, 此外还必须标注原文标题和链接.

Tags: javascript, form, action

« 上一篇 | 下一篇 »

只显示10条记录相关文章

表单提交时submit按钮的值没有被提交 (浏览: 65714, 评论: 5)
[转载]超强大的jquery formValidator (浏览: 51919, 评论: 3)
jQuery插件---获取URL参数 (浏览: 47235, 评论: 1)
JQuery学习第一天 (浏览: 36477, 评论: 3)
JS美化软件 (浏览: 33565, 评论: 4)
如何调试JS错误 (浏览: 29691, 评论: 0)
jQuery Plugins -- JQzoom (浏览: 28642, 评论: 3)
不同浏览器对回车提交表单的处理办法 (浏览: 28311, 评论: 0)
Minify的简单介绍 (浏览: 28250, 评论: 0)
利用PHP裁剪图片 (浏览: 28164, 评论: 4)

1条记录访客评论

谢谢,学习了。

Post by 基督 on 2010, July 6, 3:03 PM 引用此文发表评论 #1


发表评论

评论内容 (必填):