【js笔记】神奇的js将a标签转换为超强的submit按钮

标题可能说的有点浮夸了0.o

在以前做页面的时候,是将form表单中的提交按钮写成

<input type="submit" />

但是,总是觉得没有a标签设置样式好用,所以写了这样一个js函数来实现将a标签转换为submit按钮。

先上码:

js代码:

// 将a标签可用于表单(form)的提交js函数
//适用于一个form中有多个submit情况
function tosubmit(action_str){
    var myform=document.getElementById("myform");
    if(action_str==null){
          myform.submit();
    }else{
        myform.action= action_str;
        myform.submit();
    } 
    return false;
}

使用方法:

<form action=" action地址" class="myform" id="myform">
                    <input  name = "searchContent" value="${searchContent }"type="text" />
                    <div class="search-list">
                    <a href="#" class="search-btn" onclick="tosubmit('action地址1')">搜索1</a>
                            <ul>
                                    <li><a href="#" onclick="tosubmit('action地址2')">搜素2</a></li>
                                    <li><a href="#" onclick="tosubmit()">搜索3</a></li>
                            </ul>
                    </div>
                    </form>

说明:

  1.将a标签中href设置为“#”;

  2.设置oclick来调用js函数,如果填入参数,则跳转到指定的action

  3.默认如果不填参数是跳转到form的action

posted @ 2016-03-05 19:28  海岛心  阅读(907)  评论(0编辑  收藏  举报