jQuery实现选中弹出窗口选择框内容后赋值给文本

一、先描述下可以实现什么:

下拉框一改变,弹出框出现,选择弹出框中的值会赋值给下拉菜单

jQuery实现选中弹出窗口选择框内容后赋值给文本

二、代码:

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Subscribe策略</title> <style type="text/css"> * { margin: 0; padding: 0;} #bg{ display:none; position:fixed; _position:absolute; height:100%; width:100%; top:0; left:0; background:#000; border:1px solid #cecece; z-index:1; } #logWin{ display: none; margin-top:300; padding:0; position:fixed; _position:absolute; z-index:2; width:230px; height:140px; border:1px solid #c8c8c8; background:#fff; overflow:auto; } #logWin h2{ height:30px; background:#c8c8c8; text-align:center; line-height:30px; color:#fff; } #logWin form{ margin:20px 10px 10px 10px; } #logWin .dataArea{ margin-top:10px; } #logWin .controlArea{ margin-top:13px; margin-left:35px; } #logWin .controlArea input{ width:60px; } </style> <script src="https://www.jb51.net/js/jquery.js" type="text/javascript"></script> <script type="text/javascript"> function findit(msg){ var logStatus = 0; if(msg==2) checkWin(logStatus); } function centerWin(){ //center the Win to the center of screen var windowWidth = document.documentElement.clientWidth, windowHeight = document.documentElement.clientHeight, scrollTop = document.documentElement.scrollTop, scrollLeft = document.documentElement.scrollLeft, popupWidth = $("#logWin").width(), popupHeight = $("#logWin").height(); $("#logWin").css({ "display" : "block", "position" : "absolute", "top" : scrollTop + windowHeight/2 - popupHeight/2, "left" : scrollLeft + windowWidth/2 - popupWidth/2 }); //only need force for IE6 $("#bg").css({"height" : windowHeight}); } function checkWin(logStatus01) { logStatus=logStatus01; if (logStatus == 0) { //if the window is disabled, enable the window centerWin(); $("#bg").css({"opacity":"0.5"}); $("#bg").fadeIn("fast"); logStatus = 1; } else { //disable the window $("#bg").fadeOut("fast"); $("#logWin").fadeOut("fast"); logStatus = 0; } } $(function() { $("#no1,#no2,#no3,#no4").click(function(){ var msg01=$(this).text(); $("#role").append("<option selected='selected'>"+msg01+"</option>"); $("#logWin").css({ "display" : "", }); }); }); </script> </head> <body> <select onchange="findit(this.options[this.options.selectedIndex].value)"> <option value="1">******</option> <option value="1">******</option> <option value="2">输入</option> </select> <div> <h2>点击你想输入的内容</h2> <ul> <li>NO1</li> <li>NO2</li> <li>NO3</li> <li>NO4</li> </ul> </div> </body> </html>

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wgzjzw.html