怎样用 Javascript 模拟点击按钮执行搜索?

JavaScript014

怎样用 Javascript 模拟点击按钮执行搜索?,第1张

1、使用js模拟,其实就是给按钮添加onclick命令,然后表单action写好跳转后台处理方法,数据发送方式,默认的发送命令是form.submit()。直接发送出去。

<form action="/fmpost" method="post" name="fm">

<button name="btn" onclick="fm.submit()"></button>

</form>

2、或者表单action不写跳转方法,直接在button的onclick上写好发送链接。

<form action="" method="post" name="fm" id="fm">

<button name="btn" onclick="document.getElementById('fm').action='/fmpost'document.getElementById('fm').submit()"></button></form>

本文实例讲述了JS实现表格数据各种搜索功能。可忽略大小写,模糊搜索,多关键搜索。分享给大家供大家参考。具体实现方法如下:

复制代码

代码如下:<!DOCTYPE

html>

<html>

<head>

<meta

charset="utf-8">

<title></title>

<script

type="text/javascript">

window.onload=function(){

var

oTab=document.getElementById("tab")

var

oBt=document.getElementsByTagName("input")

oBt[1].onclick=function(){

for(var

i=0i<oTab.tBodies[0].rows.lengthi++)

{

var

str1=oTab.tBodies[0].rows[i].cells[1].innerHTML.toUpperCase()

var

str2=oBt[0].value.toUpperCase()

//使用string.toUpperCase()(将字符串中的字符全部转换成大写)或string.toLowerCase()(将字符串中的字符全部转换成小写)

//所谓忽略大小写的搜索就是将用户输入的字符串全部转换大写或小写,然后把信息表中的字符串的全部转换成大写或小写,最后再去比较两者转换后的字符就行了

/*******************************JS实现表格忽略大小写搜索*********************************/

if(str1==str2){

oTab.tBodies[0].rows[i].style.background='red'

}

else{

oTab.tBodies[0].rows[i].style.background=''

}

/***********************************JS实现表格的模糊搜索*************************************/

//表格的模糊搜索的就是通过JS中的一个search()方法,使用格式,string1.search(string2)如果

//用户输入的字符串是其一个子串,就会返回该子串在主串的位置,不匹配则会返回-1,故操作如下

if(str1.search(str2)!=-1){oTab.tBodies[0].rows[i].style.background='red'}

else{oTab.tBodies[0].rows[i].style.background=''}

/***********************************JS实现表格的多关键字搜索********************************/

//表格的多关键字搜索,加入用户所输入的多个关键字之间用空格隔开,就用split方法把一个长字符串以空格为标准,分成一个字符串数组,

//然后以一个循环将切成的数组的子字符串与信息表中的字符串比较

var

arr=str2.split('

')

for(var

j=0j<arr.lengthj++)

{

if(str1.search(arr[j])!=-1){oTab.tBodies[0].rows[i].style.background='red'}

}

}

}

}

</script>

</head>

<body>

姓名:<input

type="text"

/>

<input

type="button"

value="搜索"/>

<table

border="1"

bordercolor="blue"

id="tab">

<thead>

<td><h2>ID</h2></td>

<td><h2>Name</h2></td>

<td><h2>Age</h2></td>

</thead>

<tbody>

<tr>

<td>1</td>

<td>Blue</td>

<td>15</td>

</tr>

<tr>

<td>2</td>

<td>Mikyou</td>

<td>26</td>

</tr>

<tr>

<td>3</td>

<td>weak</td>

<td>24</td>

</tr>

<tr>

<td>4</td>

<td>sky</td>

<td>35</td>

</tr>

<tr>

<td>5</td>

<td>李四</td>

<td>18</td>

</tr>

</tbody>

</table>

</body>

</html>

希望本文所述对大家的javascript程序设计有所帮助。

目前新版本的浏览器都已经不再允许直接在地址栏输入javascript访问dom 不过可以新建书签 将地址设成你输入的地址 点书签这是可以执行的

如果你仅仅是临时性的使用浏览器执行一些javascript 不如你直接打开浏览器自带开发者工具 控制台里面输入