下拉重置查询

时间:2017-06-23 17:17:10

标签: javascript jquery html

我通过大量的试验和错误进行了以下操作.....它可以在网页中运行,但不能作为jquerymobile。 (秒表按钮应更改为'停止"按下'开始按下'。此外,如果我在第一选择下拉列表中重新选择,则下拉框不会清除.I& #39; d也喜欢自动显示的最终下拉列表,而不是选择下拉列表。有人可以帮忙吗?

由于



<!DOCTYPE html> 
<html>
<head>
<meta charset="UTF-8">
<title>jQuery Mobile Web App</title>
<link href="jquery-mobile/jquery.mobile-1.0.min.css" rel="stylesheet" type="text/css"/>
<script src="jquery-mobile/jquery-1.6.4.min.js" type="text/javascript"></script>
<script src="jquery-mobile/jquery.mobile-1.0.min.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">
function dynamicdropdown(listindex)
           {
               document.getElementById("sub_subcategory").length = 0;
               document.getElementById("sub_subcategory").options[0]=new Option("Please select bottom time","");
               document.getElementById("subcategory").length = 0;
               switch (listindex)
               {
                   case "9" :
                       document.getElementById("subcategory").options[0]=new Option("No Limit","");
                       break;

                   case "12" :
                       document.getElementById("subcategory").options[0]=new Option("Please select bottom time","");
                       document.getElementById("subcategory").options[1]=new Option("120","120-12");
                       document.getElementById("subcategory").options[2]=new Option("165","165-12");
					   document.getElementById("subcategory").options[3]=new Option("195","195-12");
                       document.getElementById("subcategory").options[4]=new Option("225","225-12");
					   document.getElementById("subcategory").options[5]=new Option("255","255-12");
                       document.getElementById("subcategory").options[6]=new Option("330","330-12");
					   document.getElementById("subcategory").options[7]=new Option("390","390-12");
                       document.getElementById("subcategory").options[8]=new Option("660","660-12");
                       document.getElementById("subcategory").options[9]=new Option("Over 660","Over 660-12");
                       break;
                   case "15" :
                       document.getElementById("subcategory").options[0]=new Option("Please select bottom time","");
                       document.getElementById("subcategory").options[1]=new Option("75","75-15");
                       document.getElementById("subcategory").options[2]=new Option("105","105-15");
					   document.getElementById("subcategory").options[3]=new Option("120","120-15");
                       document.getElementById("subcategory").options[4]=new Option("135","135-15");
                       document.getElementById("subcategory").options[5]=new Option("145","145-15");
					   document.getElementById("subcategory").options[6]=new Option("160","160-15");
                       document.getElementById("subcategory").options[7]=new Option("170","170-15");
                       document.getElementById("subcategory").options[8]=new Option("190","190-15");
					   document.getElementById("subcategory").options[9]=new Option("240","240-15");
                       document.getElementById("subcategory").options[10]=new Option("360","360-15");
                       document.getElementById("subcategory").options[11]=new Option("450","450-15");
					   document.getElementById("subcategory").options[12]=new Option("Over 450","Over 450-15");
                       break;
                  
               }
               return true;
           }

           function dynamicdropdownone(listindex)
           {
               document.getElementById("sub_subcategory").length = 0;
               switch (listindex)
               {
                   case "120-12" :
                       document.getElementById("sub_subcategory").options[0]=new Option("No Stops required","");
                       break;
                   case "165-12" :
                       document.getElementById("sub_subcategory").options[0]=new Option("5min @ 3M","");
					   break;
                   case "195-12" :
                       document.getElementById("sub_subcategory").options[0]=new Option("10min @ 3M","");
                       break;
                   case "225-12" :
                       document.getElementById("sub_subcategory").options[0]=new Option("15min @ 3M","")
                       break;
                   case "255-12" :
                       document.getElementById("sub_subcategory").options[0]=new Option("20min @ 3M","");
                      break;
				   case "330-12" :
                       document.getElementById("sub_subcategory").options[0]=new Option("25min @ 3M","");
                       break;
                   case "390-12" :
                       document.getElementById("sub_subcategory").options[0]=new Option("30min @ 3M","");
                       break;
				   case "660-12" :
                       document.getElementById("sub_subcategory").options[0]=new Option("35min @ 3M","");
                       break;
				   case "Over 660-12" :
                       document.getElementById("sub_subcategory").options[0]=new Option("40min @ 3M","");
                       break;
					   
				   case "75-15" :
                       document.getElementById("sub_subcategory").options[0]=new Option("No Stops required","");
                       break;
                   case "105-15" :
                       document.getElementById("sub_subcategory").options[0]=new Option("5min @ 3M","");
					   break;
                   case "120-15" :
                       document.getElementById("sub_subcategory").options[0]=new Option("10min @ 3M","");
                       break;
                   case "135-15" :
                       document.getElementById("sub_subcategory").options[0]=new Option("15min @ 3M","")
                       break;
                   case "145-15" :
                       document.getElementById("sub_subcategory").options[0]=new Option("20min @ 3M","");
                      break;
				   case "160-15" :
                       document.getElementById("sub_subcategory").options[0]=new Option("25min @ 3M","");
                       break;
                   case "170-15" :
                       document.getElementById("sub_subcategory").options[0]=new Option("(5min @ 6M) -- (25min @ 3M)","");
                       break;
				   case "190-15" :
                       document.getElementById("sub_subcategory").options[0]=new Option("(5min @ 6M) -- (30min @ 3M)","");
                       break;
				   case "240-15" :
                       document.getElementById("sub_subcategory").options[0]=new Option("1(0min @ 6M) -- (40min @ 3M)","");
                       break;
				   case "360-15" :
                       document.getElementById("sub_subcategory").options[0]=new Option("30min @ 6M -- 40min @ 3M","");
                       break;
                   case "450-15" :
                       document.getElementById("sub_subcategory").options[0]=new Option("35min @ 6M -- 40min @ 3M","");
                       break;
				   case "Over 450-15" :
                       document.getElementById("sub_subcategory").options[0]=new Option("35min @ 6M -- 45min @ 3M","");
                       break;

					  
                   default:
               }
               return true;
           }
      </script>
</head> 
<body> 

<div data-role="page" id="page">
	<div data-role="header">
		<h1>Divesupervisor</h1>
	</div>
    <div class="category_div" id="category_div">
         <p>&nbsp;</p>
         <p>Please select depth:
           <select name="category" class="required-entry" id="category" onChange="javascript: dynamicdropdown(this.options[this.selectedIndex].value);">
             <option value="">Depth in meters</option>
             <option value="9">9</option>
             <option value="12">12</option>
             <option value="15">15</option>
         
           </select>
         </p>
         <p>&nbsp;</p>
    </div>
       <div class="sub_category_div" id="sub_category_div">
         <p>Please select bottom time:
           <script type="text/javascript" language="JavaScript">
               document.write('<select name="subcategory" id="subcategory" onchange="javascript: dynamicdropdownone(this.options[this.selectedIndex].value);"><option value="">Time in minutes</option></select>')
           </script>
           <noscript>
               <select name="subcategory" id="subcategory" >
                 <option value="">Time in minutes</option>
               </select>
           </noscript>
         </p>
         <p>&nbsp;</p>
       </div>
       <div class="sub_subcategory_div" id="sub_subcategory_div">Decompression stops:
         <script type="text/javascript" language="JavaScript">
               document.write('<select name="sub_subcategory" onchange="javascript: urlRedirectTo(this.options[this.selectedIndex].value);" id="sub_subcategory"><option value="">Stops required</option></select>')
           </script>
           <noscript>
               <select name="sub_subcategory" id="sub_subcategory" >
                   <option value="">Required stops</option>
               </select>
         </noscript>
         
<script language="JavaScript" type="text/javascript">

var sec = -1;
var min = 0;
var hour = 0;
function stopwatch(text) {
   sec++;
  if (sec == 60) {
   sec = 0;
   min = min + 1; }
  else {
   min = min; }
  if (min == 60) {
   min = 0; 
   hour += 1; }

if (sec<=9) { sec = "0" + sec; }
   document.clock.stwa.value = ((hour<=9) ? "0"+hour : hour) + " : " + ((min<=9) ? "0" + min : min) + " : " + sec;

  if (text == "Start") { document.clock.theButton.value = "Stop "; }
  if (text == "Stop ") { document.clock.theButton.value = "Start"; }

  if (document.clock.theButton.value == "Start") {
   window.clearTimeout(SD);
   sec=sec-1;
   return true; }
SD=window.setTimeout("stopwatch();", 1000);
}

function resetIt() {
  sec = -1;
  min = 0;
  hour = 0;
  if (document.clock.theButton.value == "Stop ") {
  document.clock.theButton.value = "Start"; }
  window.clearTimeout(SD);
 }

           </script>
<body bgcolor="#FFFFFF" text="#000000" link="#0000FF" vlink="#0000FF" alink="#FF0000">
</div>
<tr valign="top">
  <td width="10%" bgcolor="#c5c3c4" align="left"><br /></td><td><p><table align="center" width="80%" cellspacing="0">
  <tr>
     <td align="center">
       <form name="clock"><br />
       <input type="text" size="12" name="stwa" /><br />
       <input type="button" name="theButton" onClick="stopwatch(this.value);" value="Start" />
       <input type="button" value="Reset" onClick="resetIt();reset();" />
       </form>
     </td>
  </tr>     
</table>
</td></tr><tr valign="top"><td colspan="2"><br /><div align="center">


</div></body></html>
	
	<div data-role="footer">
		<h4>----</h4>
	</div>
</div>



</body>
</html>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

知道这不是(还)一个答案(我可以在以后删除,如有必要),但我不能将这些细节/信息中的任何一个放在原始帖子的常规评论中......

=====

您使用的是哪种设备?在Nexus 6P上,您提到的方面对我来说似乎正常。

但是,要使用您的代码,我必须将jquery源与我所拥有的相匹配,这是更新的,并且我 NOT 表示您需要更新这些文件。

知道有一些标记放置(和其他)投诉,可能会导致旧手机/平板电脑设备出现布局和/或其他问题。

warning list

您应该能够在编辑器中轻松匹配这些行号。确保<!DOCTYPE html>位于第一行。我没有添加或删除任何行,但只复制/粘贴您的代码。您在底部附近有两个结束</body></html>标记。知道使用<script>标记不再需要属性language,并且属性type对HTML5是可选的。

这是我手机上运行的一些屏幕截图:(不按任何特定顺序排列)

phone screenshots

我暂时停在这里。如果需要,请随时提出任何问题。

哦,在旁注...如果它可能有助于为您解除HTML的混乱,将所有的javascript代码移动到一个单独的文件中,然后使用脚本标记引用该文件的方式与使用src属性的jquery文件。如果你愿意的话,你可以暂时保留它,因为这只是一个建议。