Javascript在表中单击时传递var

Question

尝试在点击<tr>时传递变量，我得到＆＃34;未定义＆＃34;。 如果我删除onclick="fnselect()"并使用我不想要的提交按钮，则无效。

＆＃13;

＆＃13;

function highlight(e) {
  if (selected[0]) selected[0].className = '';
  e.target.parentNode.className = 'selected';
}

var table = document.getElementById('table'),
  selected = table.getElementsByClassName('selected');
table.onclick = highlight;

function fnselect(){
  var phpValue = $("tr.selected td:first" ).html();
  window.location.href = "http://website/test.php?phpValue="+phpValue;
}

＆＃13;

<table id="table">
   		<tr onclick="fnselect()">
   			<td>1 Ferrari F138</td>
   			<td>1 000€</td>
   			<td>1 200€</td>
   			<td>Model monopostu stajne Scuderia Ferrari pre sezónu 2013</td>
   			<td>1</td>
   			<td>F138</td>
   			<td>Klik pre detaily</td>
   		</tr>
   		<tr onclick="fnselect()">
   			<td>2 Ferrari F138</td>
   			<td>1 000€</td>
   			<td>1 200€</td>
   			<td>Model monopostu stajne Scuderia Ferrari pre sezónu 2013</td>
   			<td>1</td>
   			<td>F138</td>
   			<td>Klik pre detaily</td>
   		</tr>
   		<tr onclick="fnselect()">
   			<td>3 Ferrari F138</td>
   			<td>1 000€</td>
   			<td>1 200€</td>
   			<td>Model monopostu stajne Scuderia Ferrari pre sezónu 2013</td>
   			<td>1</td>
   			<td>F138</td>
   			<td>Klik pre detaily</td>
   		</tr>
   	</table>

＆＃13;

＆＃13;

＆＃13;

Answer 1

使用灵活且易于使用的Jquery

function fun1(elem){

var result=$(elem).find("td").first().text();
alert(result);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr onclick="fun1(this)">
<td>A</td>
<td>B</td>
</tr>
<tr onclick="fun1(this)">
<td>C</td>
<td>D</td>
</tr>
<table>

Answer 2

您可以在this中传递onclick的引用，该引用是对所点击的tr

的引用

然后在fnselect中，您可以将传入的行引用包装在jQuery对象中，并获取该行的第一个<td>的html（）。

function highlight(e) {
  if (selected[0]) selected[0].className = '';
  e.target.parentNode.className = 'selected';
}

var table = document.getElementById('table'),
  selected = table.getElementsByClassName('selected');
table.onclick = highlight;

function fnselect(row){
  var phpValue = $(row).find("td:first").text();
  console.log(phpValue)
  //window.location.href = "http://website/test.php?phpValue="+phpValue;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="table">
   		<tr onclick="fnselect(this)">
   			<td>1 Ferrari F138</td>
   			<td>1 000€</td>
   			<td>1 200€</td>
   			<td>Model monopostu stajne Scuderia Ferrari pre sezónu 2013</td>
   			<td>1</td>
   			<td>F138</td>
   			<td>Klik pre detaily</td>
   		</tr>
   		<tr onclick="fnselect(this)">
   			<td>2 Ferrari F138</td>
   			<td>1 000€</td>
   			<td>1 200€</td>
   			<td>Model monopostu stajne Scuderia Ferrari pre sezónu 2013</td>
   			<td>1</td>
   			<td>F138</td>
   			<td>Klik pre detaily</td>
   		</tr>
   		<tr onclick="fnselect(this)">
   			<td>3 Ferrari F138</td>
   			<td>1 000€</td>
   			<td>1 200€</td>
   			<td>Model monopostu stajne Scuderia Ferrari pre sezónu 2013</td>
   			<td>1</td>
   			<td>F138</td>
   			<td>Klik pre detaily</td>
   		</tr>
   	</table>

Answer 3

单击它时，

tr不会被选中。您可以将tr对象传递给函数：

<tr onclick="fnselect(this)">

和

function fnselect(obj){
  var phpValue = obj.cells[0].innerHTML;
  window.location.href = "http://website/test.php?phpValue="+phpValue;
}