怎么在用html语言做成的网页上增加查询按钮?

怎么在用html语言做成的网页上增加查询按钮?,第1张

要看你想放置的位置块,然后添加form表单

<form>

<input type="button" value="按钮上显示的文字" />

<input type="submit" value="按钮上显示的文字" />

</form>

form表单中有两种按钮:button与submit。

显示搜索按钮需要满足3个条件:

1.input在form标签中

2.form标签设置了action属性值

3.input设置type为search

示例如下:

<form action="#">

    <input type="search" />

</form>

这种情况下点击搜索按钮会跳转到action对应的地址进行搜索

如果我们需要js来处理搜索逻辑,可以设置form不提交,并且监听输入框的keydown事件

示例如下:

<form action="#" onsubmit="return false">

    <input type="search" id="t_search" />

</form>

<script type="text/javascript">

$("#txt_search").keydown(function (e) {

    if (e.keyCode == 13) {

        //搜索处理

    }

})

</script>

还有一个前往按钮,也类似,把type换成text就可以了,所以form很重要,如果我们不放form,就是“换行”按钮了。

end

这个不怎么难啊,看下面代码

<html>

<head>

<title>File</title>

<style type="text/css">

#infile {visibility: hidden}

input {font-family: Verdanafont-size: 9pt}

</style>

<script language="JavaScript">

function changeName()

{

var f = document.getElementById("filename")

f.value = document.getElementById("infile").value

}

function openFile()

{

document.getElementById("infile").click()

}

</script>

</head>

<body>

<input type="file" id="infile" onChange="changeName()" />

<input type="text" id="filename" size="50" maxlength="50" />

<a href="javascript: openFile()"><img src="***.jpg" border="0" /></a>

</body>

</html>

原理:

点击图片链接时,触发打开文件框,如果file框里的内容改变时,把file框里的内容传到文本框。


欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/zaji/7538823.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-06
下一篇 2023-04-06

发表评论

登录后才能评论

评论列表(0条)

保存