怎样用jquery做一个d出的输入框?

怎样用jquery做一个d出的输入框?,第1张

1、新建并保存一个html文档,进入html代码编辑页面。

2、写一个input文本输入框,并定义ID,然后写一个按钮,并定义ID。

3、要做的效果就是点击按钮为输入框赋值,然后把输入框和按钮的css样式写好,不写样式也可以。

4、引入jquery文件,路径要正确,写jquery代码,打开浏览器测试一下,点击按钮之后,输入框内就会自动输入赋值的内容。

html代码如下:

<input

type="button"

value="显示"

id="b1"/>

jquery代码如下:

添加jquery引用。。。

<script

type="text/javascript">

$(function(){

$("b1").click("d出一个窗口页面")

})

</script>

不知楼主说的窗口页面是否是这样的。

<html>

<head><title>Simple jsp page</title>

<style type="text/css">

<!--

#div1 {

position:absolute

left:338px

top:91px

width:446px

height:294px

z-index:1

border:solid #7A7A7A 4px

}

</style>

<script

src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

<script type="text/javascript">

$(function(){

$("#div1").hide()//先让div隐藏

$("#span1").click(function(){

$("#div1").fadeIn("slow")//淡入淡出效果 显示div

})

$("#span2").click(function(){

$("#div1").fadeOut("slow")//淡入淡出效果 隐藏div

})

})

</script>

</head>

<body>

1个简单d出div的小例子 页面不是很美观 效果达到了<p/><p/><p/><p/><p/><p/>

<span style="cursor:pointer" id="span1">点我d出div</span>

<div id="div1">

<div align="right" style="background-color:#CDCDCD"><span id="span2" style="cursor:pointer">关闭</span>

</div>

<p><p>

<form>

username:<input type="text"/><p />

age:<input type="text"/><p />

<input type="submit" value="submit"/><br />

</form>

</div>

</body>

</html>

以上代码直接复制粘贴,html文件就可以运行,可以做d出 *** 作。


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

原文地址: http://outofmemory.cn/bake/11747570.html

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

发表评论

登录后才能评论

评论列表(0条)

保存