請有人修復此SHOW / HIDE Table Javascript代碼

Question

請有人修復此Javascript代碼。

該腳本實際上讀取URL參數，然后根據參數顯示/隱藏表行。

我在Sack Overflow上找到了該腳本，但是在Dreamweaver上嘗試時卻無法正常工作。

請有人仔細檢查腳本並修復其中的錯誤。

腳本是：這里有兩頁...

首先是First_page.html ：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<a href="Second_page.html?showid=tblRow14">First Row</a><br />
<a href="Second_page.html?showid=tblRow46">Second Row</a><br />
<a href="Second_page.html?showid=tblRow30">Third Row</a><br />
</body>
</html>

並且Second_page.html如下所示：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<head>
<style>
#theTable>tbody>tr { display: none; } //hide rows by default
</style>
<script type="text/javascript">
function getUrlVar(varName) { //returns empty string if variable name not found in URL
  if (!varName) return ''; //no variable name specified. exit and return empty string

  varName = varName.toLowerCase(); //convert to lowercase
  var params = location.search; //get URL

  if (params == '') return ''; //no variables at all. exit and return empty string

  var vars = params.split('?')[1].split('&'); //get list of variable+value strings

  for (var i = 0; i < vars.length; i++) { //check each variable
   var varPair = vars[i].split('='); //split variable and its value

   if (varPair.length > 1) { //has "=" separator

     if (varPair[0].toLowerCase() == varName) { //same variable name?
       return varPair[1]; //found variable. exit and return its value
     } //else: check next variable, if any

   } //else: is not an array. i.e.: invalid URL variable+value format. ignore it
  }
  return ''; //no matching variable found. exit and return empty string
}

function show() {
  var value = getUrlVar('showid'); //get variable value
  if (!value) return; //variable not found
  if (parseInt(value) == NaN) return; //value is not a number

  var row = document.getElementById('tblRow' + value); //get the element by ID name
  if (!row) return; //element not found

  row.style.display = 'inherit'; //set element display style to inherited value (which is visible by default)
}
</script>
</head>

<body onLoad="show();">
<table id="theTable">
  <tr id="tblRow14"><td>row ID 14</td></tr>
  <tr id="tblRow46"><td>row ID 46</td></tr>
  <tr id="tblRow30"><td>row ID 30</td></tr>
</table>
</body>
</html>

請修復它或幫助我找到一個新的Javascript代碼，其工作原理與此相同……

請幫助我。

Answer 1

“值”變量已經具有的ID。 因此，只需更改此行：

var row = document.getElementById(value);

它將起作用。

Answer 2

網址中的參數showid必須為整數。 在First_page.html中更改您的鏈接。

<a href="Second_page.html?showid=14">First Row</a><br />
<a href="Second_page.html?showid=46">Second Row</a><br />
<a href="Second_page.html?showid=30">Third Row</a><br />

請有人修復此SHOW / HIDE Table Javascript代碼

問題描述

2 個解決方案

解決方案1
0 2012-08-29 16:45:58

解決方案2
0 已采納 2012-08-29 16:48:10

請有人修復此SHOW / HIDE Table Javascript代碼

問題描述

2 個解決方案

解決方案1 0 2012-08-29 16:45:58

解決方案2 0 已采納 2012-08-29 16:48:10

解決方案1
0 2012-08-29 16:45:58

解決方案2
0 已采納 2012-08-29 16:48:10