顯示輸入名稱的onmouseover

我想顯示輸入名稱當圖像被徘徊，怎麼可能與下面的示例代碼：顯示輸入名稱的onmouseover

HTML

<img src="imagesample.jpg" height="150px" width="150px" /> 

<form> 
    first name: <input type="text" name="fn"> 
    <button onclick="return show(this.form)">send</button> 
</form> 

<table border="1px" style="width: 350px; height: 250px;"> 
    <tr> 
     <td> 
      <p id="displayhere"></p> 
     </td> 
    </tr> 
</table>

的JavaScript

function show(myform) { 
    var string = ""; 

    string += myform.fn.value; 

    document.getelementbyid("displayhere").innerhtml = string 
    return false; 
}

當鼠標懸停圖像時，我應該如何處理名字輸入以顯示？

來源

2014-03-07 user3359630

的document.getElementById（「displayhere」）的innerHTML =串。分號丟失... – Ashish

@Ashish你不能通過僅添加分號來修復該特定行; ）。 – Teemu

我只是第一眼看到它 – Ashish

JavaScript方法區分大小寫，這就是爲什麼你的代碼目前沒有工作。讓自己的生活更輕鬆，並給你的形象，顯示和形式id s，讓你可以瞄準他們。然後添加監聽到你的形象，將字符串在鼠標懸停顯示並清空鼠標移出顯示：

HTML

<img id="sampleimage" src="imagesample.jpg" height="150px" width="150px" /> 
<form id="myform">first name: 
    <input type="text" name="fn"> 
    <button onclick="return show(this.form)">send</button> 
</form> 
<table border="1px" style="width: 350px; height: 250px;"> 
    <tr> 
     <td> 
      <p id="displayhere"></p> 
     </td> 
    </tr> 
</table>

的JavaScript

var img = document.getElementById('sampleimage'), 
    disp = document.getElementById('displayhere'), 
    frm = document.getElementById('myform'); 

img.addEventListener('mouseover', function() { 
    var string = frm.fn.value; 
    disp.innerHTML = string; 
}); 
img.addEventListener('mouseout', function() { 
    disp.innerHTML = ''; 
});

JSFiddle

來源

2014-03-07 12:24:28 George

我同意你的意見，真的解決了OP的問題，是嗎？ –

@OvidiuIacomi你說得對，我應該在閱讀時多加註意。更新。 – George

試試這個

<script> 

function onHover() 
{ 
    show(); 
} 
function show() { 
    var myform=document.getElementByid("fromid") 
var string = ""; 

string += myform.fn.value; 

document.getElementByid("displayhere").innerhtml = string 
return false; 
} 
</script> 
<img src="imagesample.jpg" onmouseover="onHover();" height="150px" width="150px" /> 

<form id="fromid"> 
first name: <input type="text" name="fn"> 
<button onclick="return show(this.form)">send</button> 
</form> 

<table border="1px" style="width: 350px; height: 250px;"> 
<tr><td><p id="displayhere"></p></td></tr> 
</table>

來源

2014-03-07 12:28:02 Sergey92zp

嘗試這樣

HTML

<img src="imagesample.jpg" height="150px" width="150px" onmouseover="show()" onmouseout="normal()" />

的javascript

function show() 
{ 
document.getElementById('displayhere').style.display = 'block'; 
} 
function normal() 
{ 
document.getElementById('displayhere').style.display = 'none'; 
}

來源

2014-03-07 12:47:48 next2u

顯示輸入名稱的onmouseover

回答

相關問題