2017-06-18 11 views
0

ポイントは、要素の背景色を変更することによって、マウス移動のWebページの特定の要素に焦点を当てることでした。 (それはフォーカスを使用して、そうすることが示唆されたのと同じトピックに関する以前のANSを読むhtmlコードからjavascript関数にランタイムパラメータを渡す方法

function focus(e_id){ 
var element = document.getElementById("e_id").style.backgroundColor ="blue"; 
} 

function original(e_id){ 
var element = document.getElementById("e_id").style.backgroundColor="green"; 
} 

を次のように

<html> 
<head> 
<base src="..... /> 
<script>....</script> 
<link..../> 
<title></title> 
</head> 
<body> 
<p style="font-size:20px;font-weight:bold"> Enter values or choose options 
in the form below .</p> 
<div id="d1"> 

<form id="f1" action="" method="post"> 
<fieldset> 
    <legend><a name="pdet"></a>Personal Details</legend> 
    <table id="t1" width="400" height="auto" rows="4" cols="2"> 
     <tr id="tr1" onMouseMove ="focus(tr1)" onMouseOut ="original(tr1)"> 
      <td><label for="fname">First Name :<label></td> 
      <td><input type="text" id="fname" col="30"></input></td> 
     </tr> 
     <tr id="tr2" onMouseMove ="focus(tr2)" onMouseOut ="original(tr2)"> 
      <td><label for="lname">Last Name : </label></td> 
      <td><input type="text" id="lname" col="30"></input></td>     
     </tr> 
    </table> 
</fieldset> 
</form> 
</div> 
<br/> 
</body> 
</html> 

JavaScriptの機能は次のように

htmlがありますthis)」または「focus(this.id)」を引数として渡して、要素自体または要素のidをそれぞれ渡します。試してみましたが動作しませんでした。

誰でもこの問題を解決するのに役立つことができますか?

+2

"e_id"は文字列であり、変数への参照ではありません – epascarello

答えて

0

引用符が誤って使用されているだけで問題になります。

function elfocus(e_id){ 
 
// do not use quotes around e_id in order to use the function argument 
 
var element = document.getElementById(e_id).style.backgroundColor ="blue"; 
 
} 
 

 
function original(e_id){ 
 
var element = document.getElementById(e_id).style.backgroundColor="green"; 
 
}
<p style="font-size:20px;font-weight:bold"> Enter values or choose options 
 
in the form below .</p> 
 
<div id="d1"> 
 

 
<form id="f1" action="" method="post"> 
 
<fieldset> 
 
    <legend><a name="pdet"></a>Personal Details</legend> 
 
    <table id="t1" width="400" height="auto" rows="4" cols="2"> 
 
     <tr id="tr1" onMouseMove ="elfocus('tr1')" onMouseOut ="original('tr1')"> 
 
     <!-- put single quotes arount tr1 so that it is passed as a string --> 
 
      <td><label for="fname">First Name :<label></td> 
 
      <td><input type="text" id="fname" col="30"></input></td> 
 
     </tr> 
 
     <tr id="tr2" onMouseMove ="elfocus('tr2')" onMouseOut ="original('tr2')"> 
 
      <td><label for="lname">Last Name : </label></td> 
 
      <td><input type="text" id="lname" col="30"></input></td>     
 
     </tr> 
 
    </table> 
 
</fieldset> 
 
</form> 
 
</div> 
 
<br/>

イベントリスナーがあなたの実装を使用しない場合がありますのでwindow.focusがすでに既存の関数であるので、また、私は、フォーカス機能の名前を変更しました。

1

e_id(変数識別子)ではなく、"e_id"(文字列)を使用している可能性があります。

関連する問題