input+div+js模拟select

2015-10-24 04:42:16 327 阅读 AI 写同款 · GEO 优化AI 选题数据监测一键分发 ›

jeesite实战(四十)——js动态实现select、input等标签的只读以及赋值系列文章目录提示：写完文章后，目录可以自动生成，如何生成可参考右边的帮助文档 js动态实现select、input等标签的只读以及赋值系列文章目录前言一、目的二、实现过程效果图input标签html中input标签代码js动态设置input标签为只读js动态设置input标签的值select标签html中select标签代码js动态设置select标签为只读js动态设置select标签的值listselect标签html中listselect标签代码js动态设置listselect标签为只读js动态设阅读详情

input+div+js模拟select，但是不能准确获取到选中的td的值



/* select nation */	

function createNationList(rowCount,cellCount)

  { 

   var i,j;

   var Nation=new Array(  ['汉族','蒙古族','彝族','侗族'],['哈萨克族', '畲族','纳西族','仫佬族'],['仡佬族','怒族','保安族', '鄂伦春族'],

                                              ['回族','壮族','瑶族','傣族'],

					      ['高山族', '景颇族','羌族','锡伯族'],['乌孜别克族','裕固族','赫哲族', '藏族'],['布依族','白族','黎族','拉祜族'],

                                              ['柯尔克孜族','布朗族','阿昌族','俄罗斯族'],

					      ['京族','门巴族','维吾尔族','朝鲜族'], [ '土家族','傈僳族','水族','土族'],

                                              ['撒拉族','普米族','鄂温克族', '塔塔尔族'],['珞巴族','苗族','满族','哈尼族'],

					      ['佤族','东乡族','达斡尔族','毛南族'], ['塔吉克族','德昂族','独龙族','基诺族']);

     var table=$("<table>");

	 table.id="nationTable";

     table.appendTo($("#nationList"));

     for(i=0;i<rowCount;i++)

     {

        var tr=$("<tr></tr>");

        tr.appendTo(table);

        for( j=0;j<cellCount;j++)

        {	

           var td=$("<td>"+Nation[i][j]+"</td>");

           td.appendTo(tr);		

        }

     }

     $("#nationList").append("</table>");

  }



/* return value to input and than colse the List */



function returnValue(){

	var div= document.getElementById("nationList");

    var tds = div.getElementsByTagName("td"); 

	var input=document.getElementById("nation");     

     for (var i = 0; i < tds.length; i++) {  

        tds[i].onClick = function() {  

           input.value=tds[i].innerHTML;   

        }  

    }  

}

...全文

python selenium 高级应用：非select下拉框、动态id、无唯一属性定位前言：接了人生中第一个python单子，用selenium自动化，是一个比较时新的网站，用了大量的js渲染，费了很大的力气，但我也终于发现了——任何人能够进行的浏览器操作都可以用selenium实现 1.非select类下拉框在非select类下拉框这里遇到了两种需求，一种是可输入字符，一种是不可输入字符 1.1输入部分字符按照智能提示点选这种下拉框允许输入字符，沟通后确定输入字符如出现多个选项则点选第一个思路：用send_keys输入字符后会激活下拉框进行智能提示，然后用ActionChai 阅读详情

zhituji

JavaScript 87,984 成员 224,681 内容

+ 关注 + 加入社区

切换为时间正序

liusaint1992 2015-10-24

打赏
举报

引用 4 楼 zhituji 的回复:

[quote=引用 3 楼 liusaint1992 的回复:] returnValue() 你是什么时候调用的？


window.onload = function(){
createNationList(rowCount,cellCount);
returnValue();
}


function returnValue(){
    var div= document.getElementById("nationList");
    var tds = div.getElementsByTagName("td"); 
    var input=document.getElementById("nation");     
     for (var i = 0; i < tds.length; i++) {  
        tds[i].onClick = function() {  
           document.getElementById("nation").value=this.innerHTML;   
        }  
    }  
}

这样试试？

这样也不行，原来是可以获取的但是总是显示最后一个民族大概是循环的问题吧。


 <!--选择民族-->
         <tr><td >民       族：</td>
             <td><input id="nation" name="nation"  placeholder="请选择民族" onClick="Display(nationList);" />
                 <div id="nationList" name="nationList" onmouseover="changeBackgroundColor('nationList');" 
                 onClick="returnValue();"></div></td></tr>

[/quote] 貌似闭包了。后面点击事件的时候。i取returnValue运行最后的值。

liusaint1992 2015-10-24

打赏
举报

自己写的demo.



<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<script language="JavaScript" type="text/javascript">
window.onload = function(){
returnValue();
};


function returnValue(){

    var inputs = document.getElementsByTagName("input"); 
    var button = document.getElementsByTagName("button")[0];
     for (var i = 0; i < inputs.length; i++) {  
        inputs[i].onClick = function() {  
           button.innerHTML=this.value;   
        }  
    }  
} 


	</script>
</head>
<style type="text/css">
	input{
		height: 20px;
		width: 100px;
	}
</style>
<body>
	<input class="input" type="button" value="1">
	<input class="input" type="button" value="2">
	<input class="input" type="button" value="3">

	<button></button>
</html>

另外，楼主你的 tds[i].onClick onClick要小写。 tds[i].onclick

zhituji 2015-10-24

打赏
举报

引用 5 楼 jslang 的回复:

$("#nationList").append("</table>");这行去掉 tds[i].onclick = function() { c是小写

成功了，好激动

天际的海浪 2015-10-24

打赏
举报

$("#nationList").append("</table>");这行去掉 tds[i].onclick = function() { c是小写

zhituji 2015-10-24

打赏
举报

引用 3 楼 liusaint1992 的回复:

returnValue() 你是什么时候调用的？


window.onload = function(){
createNationList(rowCount,cellCount);
returnValue();
}


function returnValue(){
    var div= document.getElementById("nationList");
    var tds = div.getElementsByTagName("td"); 
    var input=document.getElementById("nation");     
     for (var i = 0; i < tds.length; i++) {  
        tds[i].onClick = function() {  
           document.getElementById("nation").value=this.innerHTML;   
        }  
    }  
}

这样试试？

这样也不行，原来是可以获取的但是总是显示最后一个民族大概是循环的问题吧。


 <!--选择民族-->
         <tr><td >民       族：</td>
             <td><input id="nation" name="nation"  placeholder="请选择民族" onClick="Display(nationList);" />
                 <div id="nationList" name="nationList" onmouseover="changeBackgroundColor('nationList');" 
                 onClick="returnValue();"></div></td></tr>

liusaint1992 2015-10-24

打赏
举报

returnValue() 你是什么时候调用的？


window.onload = function(){
createNationList(rowCount,cellCount);
returnValue();
}


function returnValue(){
    var div= document.getElementById("nationList");
    var tds = div.getElementsByTagName("td"); 
    var input=document.getElementById("nation");     
     for (var i = 0; i < tds.length; i++) {  
        tds[i].onClick = function() {  
           document.getElementById("nation").value=this.innerHTML;   
        }  
    }  
}

这样试试？

zhituji 2015-10-24

打赏
举报

引用 1 楼 jslang 的回复:

for (var i = 0; i < tds.length; i++) { tds[i].onClick = function() { input.value=this.innerHTML; } }

这样也不行耶。。。

天际的海浪 2015-10-24

打赏
举报

for (var i = 0; i < tds.length; i++) { tds[i].onClick = function() { input.value=this.innerHTML; } }

input+div+js模拟select

相关推荐