Image onClick不起作用

-1

我的问题有2个部分。 1.我的onclick事件不起作用。 2.我想更改<div>中的文本，方法是提供一个文本框供用户更改<div>中的文本。Image onClick不起作用

让我告诉你我的代码，以更好地理解这种

HTML：

<div class="img"> 
    <img src="bird-light.png" alt="Klematis" width="110" height="90" onclick="changetext(this)" /> 
<div id="desc" >Add a description of the image by clicking on the bird</div> 
</div> 
<div class="img"> 
    <img src="bird-dark.png" alt="Klematis" width="110" height="90" onclick="changetext(this)" /> 
<div id="desc">Add a description of the image by clicking on the bird </div> 
</div>

CSS：

div.img{ 
    width:250px; 
    border: 1px solid #0000ff; 
    height: auto; 
    float:left; 
    background-color:#474747; 
    color:#fff; 
}

JAVASCRIPT：

function changetext(e){  
    alert("hi"); 
    txtarea = document.getElementById('desc'); 
}

I created a Fiddle

回到问题。

出于某种原因，JavaScript函数警报未执行，这意味着我的函数没有被触发。
我希望用户能够编辑<div>中的文本。我的意思是，当用户点击图像时，他/她应该得到一个允许他/她修改<div id="desc">的文本内容的文本框。是否有可能只使用JavaScript。如果是，如何？

来源

2013-07-12 AnaMaria

首先id必须是唯一的，否则没有简单的方法可以在你的小提琴中获得id desc的第二个元素 – bugwheels94

See thi使网格的可编辑的网址：http://stackoverflow.com/questions/2441565/how-do-i-make-a-div-element-editable-like-a-textarea-when-i-click-it – Zhanger

你首先是因为你使用的jsfiddle与“中的onLoad包装脚本”，这意味着该函数只存在于那onload事件和不可用的单击事件一个非问题。

Updated Fiddle，其中代码保持原状。

你几乎可以用JavaScript做任何事情。接受用户输入什么都不是。最简单的就是var userinput = prompt("Type something","Default value");，但是你真的想学习一些东西，比如document.createElement,Element.appendChild等，以便创建一个textarea元素并将其显示给用户。

来源

2013-07-12 07:37:50

那么。谢谢。你能指导我一个资源或教程，可以帮助我吗？ – AnaMaria

@AnaMaria [Mozilla开发者网络]（https://developer.mozilla.org/en-US/docs/Web/JavaScript）学习的好地方。 – Praveen

我有这么远... http：// jsfiddle。net/qbXcw/10/ – AnaMaria

你捣鼓为我工作，如果我改变了JS功能类似下面的onLoad：

changetext = function (e) { 
    alert("hi"); 
    var txtarea = document.getElementById('desc'); 
}

检查Jsfiddle

要在DIV编辑内容，请使用innerHTML

document.getElementById('desc').innerHTML = "content changed";

来源

2013-07-12 07:38:09 Praveen

酷。现在我的问题的第二部分是什么。这是一个挑战... – AnaMaria

@AnaMaria阐明了你的问题。 ID应该是唯一的，所以在两者中都将它改为'class =“desc”'。 – Praveen

Image onClick不起作用

回答

相关问题