给指定范围的分值赋予动态的input，分值只能出现一次

最新推荐文章于 2024-03-09 11:52:10 发布

随遇不安

最新推荐文章于 2024-03-09 11:52:10 发布

阅读量189

点赞数

分类专栏：前台jquery

本文链接：https://blog.youkuaiyun.com/sinat_24992521/article/details/102471800

版权

前台jquery 专栏收录该内容

1 篇文章

订阅专栏

由于用的数组存放的，并且存放起来更改很麻烦，就隐藏了button ，input也只读了
在这里插入图片描述

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<%@include file="include/include.jsp"%>
<title>动态分值</title>
</head>
<body>
	<div class="col-xs-12 nopadding">
		<div class="panel panel-default">
			<!-- Default panel contents -->
			<div class="panel-heading">input列表</div>

			<!-- Table -->

		</div>
	</div>
	<div class="col-xs-12" id="div_id"></div>
</body>
<script type="text/javascript">
	//接收随机数
    var rand = 1;
	
    var start = 0;
    var end = 11;
    //获取button 编号ID
    var button_id = "";
    // 拼接input编号
    var input_id = "";
    var arr = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0,];
    $(document).ready(function() {
	 /* $(".pagination").pagination(); */
     rand = parseInt(Math.random() * (15-1 + 1) + 1);
	 console.log("随机数的长度为："+rand)
	 for(var i = 1 ;i < rand+1; i++ ){
		 $("#div_id").append("第"+(i)+"个："+'<input type="number" class="form-control" id='+'ip'+(i) +' style="width:40%;">'+
				 '<button type="button"  class="btn btn-success" id='+'button'+(i) +'>点我一下</button></br>');
		 
		 
	 }
    });
 
            var nary=arr.sort();
            $(function(){
			  	   $("button").one("click",function(){
			  		  //$(this).attr("disable","disable");
			  		 button_id = this.id.replace('button',"");
			  	    input_id="ip"+button_id;
			  	    var result = $("#"+input_id).val();
			  	    //js 判断的时候 用&& 连接 
			  	    if(start < parseInt(result)&&parseInt(result) < end){
			  	    	if(nary.indexOf(parseInt(result))<0){
			  	    		//按钮消失
			  	    		$(this).attr("style","display:none")
			  	    		//input 只读状态
			  	    		$("#"+input_id).attr("readonly","readonly");
			  	    		nary.push(parseInt(result));
			  	    	}
			  	    	else{
			  	    		alert("分值已存在了！")
			  	    		console.log(nary)
			  	    	}
			  	    	
			  	    }
			  	    else{
			  	    	alert("输入有误，请核对！");
			  	    }
			  	   });			  			  				  				  	
			  });
    
</script>
</html>