首页 技术 正文
技术 2022年11月23日
0 收藏 573 点赞 3,223 浏览 4038 个字

1.用jQuery编程实现获取选中复选框值的函数abc。

 <body>
<input type="checkbox" name="aa" value="0" />0
<input type="checkbox" name=" aa " value="1" />1
<input type="checkbox" name=" aa " value="2" />2
<input type="checkbox" name=" aa " value="3" />3
<input type="button" onclick="abc ( )" value="提 交" />
<div id="allselect"></div>
</body>

答案:

 function abc(){
$("input:checked").each(function(){
alert($(this).val())
})
}

2.实现foo函数弹出对话框提示当前选中的是第几个单选框。

 <html>
<body>
<form name="form1" onsubmit="return foo();">
<input type="radio" name="radioGroup"/>
<input type="radio" name="radioGroup"/>
<input type="radio" name="radioGroup"/>
<input type="radio" name="radioGroup"/>
<input type="radio" name="radioGroup"/>
<input type="radio" name="radioGroup"/>
<input type="submit"/>
</form>
</body>
</html>

答案:

<script>
function foo(){
var a=document.getElementsByName("radioGroup");
for(var i=0;i<a.length;i++){
if(a[i].checked){
alert(i+1);
}
}
}
</script>

3.实现LoadImg函数改变下拉列表框显示图片,并显示在文本框中。

 <html>
<head>
<title>图像切换</title>
</head>
<body>
<form name="form1" >
<p><input type="text" name="T1" size="20">
<select size="1" name="D1" onchange="LoadImg(this.form)">
<option selected value="images\img01.jpg">图片一</option>
<option value="images\img02.jpg">图片二</option>
<option value="images\img03.jpg">图片三</option>
</select></p>
<img src="data:images\Img01.jpg" name="img1" width=250 height=200>
</form>
</body>
</html>

答案:

 <script>
function LoadImg(f){
var a=document.getElementsByName("T1")[0];
var b=document.getElementsByName("D1")[0];
var c=document.getElementsByName("img1")[0];
a.value=b.options[b.selectedIndex].text;
c.src=b.options[b.selectedIndex].value;
}
</script>

4.要求用jQuery完成:  点击id为btn的按钮

a.判断id为username的输入是否为空,如果为空,则弹出“用户名不能为空”的提示。

b.判断id为password的输入字符串个数是否小于6位,如果小于6位,则弹出“你输入的密码长度不可以少于6位”的提示

 <body>
用户名:<input type="text" id="username"/><br/>
密 码:<input type="password" id="password"/><br/>
       确认密码:<input type="password" id="password1"/><br/>
<button id="btn" type="button">提交</button><br/>
</body>

 答案:

 <script>
$(document).ready(function(e){
$("button").click(function(){
if($("#username").val()==""){
alert(" 1");
}
if($("#password").val().length){
alert("2 ");
}
})
})
</script>

5.在下面的HTML文档中,编写函数test() ,实现如下功能:

(1)当多行文本框中的字符数超过20个,截取至20个

(2)在id为number的td中显示文本框的字符个数

JAVASCRIPT试题及答案

 <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>留言</title>
</head>
<body>
<table>
<tr>
<td>留言</td>
<td id="number"> 0 </td>
</tr>
<tr>
<td colspan=2>
<textarea id="feedBack" onkeyup="test()" rows=6></textarea>
</td>
</tr>
</table>
</body>
</html>

答案:

 <script>
var $a=$("#number");
var b=document.getElementById("feedBack")
function test(){
if(b.value.length>20){
b.value=b.value.substring(0,20)
}
$a.text(b.value.length);
}
</script>

6.要求用javascript完成下图的功能

JAVASCRIPT试题及答案JAVASCRIPT试题及答案

根据题意写出checkInput和update函数的实现

checkInput函数功能为,当前输入框内容不为数字的时候要警告,返回后,文本框内容应处于选中状态

 <body>
<table id="t" border="1px">
<caption>甲骨文练习</caption>
<tr>
<td>HTML</td>
<td>JavaScript</td>
</tr>
<tr>
<td>JavaSE</td>
<td>Oracle</td>
</tr>
<tr>
<td>MySQL</td>
<td>Struts2</td>
</tr>
</table><br>
设置指定单元格的值:<br/>
第<input type="text" id="r" onblur="checkInput(this)">行,<br/>
第<input type="text" id="c" onblur="checkInput(this)">列<br/>
的值为<input type="text" id="q" > <br/>
<input type="button" value="修改" onClick="update()">
</body>

答案:

 <script>
function checkInput(a){
var a=/^[0-9]*$/;
if(!angular.test(a.value)){
alert("请输入数字");
}
}
function update(){
var r=document.getElementById("r").value;
var c=document.getElementById("c").value;
var val=document.getElementById("q").value;
document.getElementById("t").rows[r-1].cells[c-1].innerHTML=val;
}
</script>

7.实现getOptions函数,点击按钮把选中内容输出在按钮下方。

JAVASCRIPT试题及答案JAVASCRIPT试题及答案

 <body>
<form>
Select your favorite fruit:
<select id="mySelect" multiple="multiple" size="4">
<option>Apple</option>
<option>Orange</option>
<option>Pineapple</option>
<option>Banana</option>
</select>
<br /><br />
<input type="button" onclick="getOptions()"
value="Output all options">
<div id="allselect"></div>
</form>
</body>

答案:

 <script>
function getOptions(){
$("option:checked").each(function(){
alert($(this).val())
})
}
</script>

8.实现sel函数显示当前选项的文本和值。

 <form name="a">
<select name="a" size="1" onchange="_sel(this)">
<option value="a">1</option>
<option value="b">2</option>
<option value="c">3</option>
</select>
</form>

答案:

 <script>
function _sel(a){
alert($("option:checked").text()+$("option:checked").val())
}
</script>
相关推荐
python开发_常用的python模块及安装方法
adodb:我们领导推荐的数据库连接组件bsddb3:BerkeleyDB的连接组件Cheetah-1.0:我比较喜欢这个版本的cheeta…
日期:2022-11-24 点赞:878 阅读:8,992
Educational Codeforces Round 11 C. Hard Process 二分
C. Hard Process题目连接:http://www.codeforces.com/contest/660/problem/CDes…
日期:2022-11-24 点赞:807 阅读:5,506
下载Ubuntn 17.04 内核源代码
zengkefu@server1:/usr/src$ uname -aLinux server1 4.10.0-19-generic #21…
日期:2022-11-24 点赞:569 阅读:6,349
可用Active Desktop Calendar V7.86 注册码序列号
可用Active Desktop Calendar V7.86 注册码序列号Name: www.greendown.cn Code: &nb…
日期:2022-11-24 点赞:733 阅读:6,134
Android调用系统相机、自定义相机、处理大图片
Android调用系统相机和自定义相机实例本博文主要是介绍了android上使用相机进行拍照并显示的两种方式,并且由于涉及到要把拍到的照片显…
日期:2022-11-24 点赞:512 阅读:7,767
Struts的使用
一、Struts2的获取  Struts的官方网站为:http://struts.apache.org/  下载完Struts2的jar包,…
日期:2022-11-24 点赞:671 阅读:4,844