专注于WEB技术的IT博客

js选中下拉框项自动提交表单

时间:2013-01-22分类: Js浏览:13661
分享到:

据一位网友反映,他使用WBlog博客程序发现了一个浏览器不兼容的问题,在火狐浏器下添加栏目时,选择模型后,上级栏目没有出现相应的栏目列表!


在解决这个问题之前,先来说一下栏目表单添加的原理。


     在添加栏目的过程中,首先选择模型,如文章、图片、下载等模型,选中下拉菜单的一项后,会触发JS的onChange()事件,自动提交表单,返回该模型相应的栏目。代码如下:

<form action="/Admin/News/insert" method="POST" > 
    <table width="100%" cellspacing="0" style="font-size:12px;"> 
       <tbody> 
            <tr> 
            <td width="100" align="center">请选择模型:</td> 
            <td align="left"> 
           <select name="modelid" id="modelid" onChange="document.all.dosubmit.click()"> 
         <option value="0">模型</option>   
            <volist name="mlist" id="mo"> 
              <if condition="$modelid eq $mo['modelid']">  
               <option value="$mo['modelid']" selected>{$mo['model']} </option> 
              <else />    
                <option value="{$mo['modelid']}">{$mo['model']}</option>  
              </if> 
              
               </volist>        
                           
        </select>         
      <input  type="submit"  name='dosubmit' style="display: none;" value="提交" />   
          </td>    
        </tr> 
   </form>

在整个JS自动触发事件的过程中,起关键作用的代码是onChange="document.all.dosubmit.click()",经测试,这段JS代码在IE浏览器中可以正常执行,但到了火狐浏览器后,却无法执行了。


问题的解决办法
1、经表单<form action="/Admin/News/insert" method="POST" >添加一个ID名称,如<form id="mid" action="/Admin/News/insert" method="POST" >
2、把document.all.dosubmit.click()修改为document.getElementById('mid').submit()

完成上面的修改后,添加栏目可以在IE、火狐和谷哥浏览器完成!因为我的电脑里就只装了以上三种主流浏览器,其它的有等测试。


      


猜你喜欢
wblog3.1.3_2升级说明
比较一下wblog在谷歌和百度的排名
如何让ThinkPHP的模板引擎达到最佳效率
WBlog博客前台独立栏目页的实现方法
WB3.1.2_2版本使用说明
WBlog3.1升级到WBlog3.12啦
KindEditor在thinkphp上的使用方法
给thinkphp3.1案例blog写一个更新tag的函数
Wblog博客程序管理系统
标签 : wblog js
除非注明,本文首发网志博客,欢迎转载!转载请注明本文地址:http://w3note.com/web/73.html,谢谢。
  • 评论
  • 赞助本站