1

这可能吗,单击图像即可同时获取图像名称和 src 吗?

我是 javascript 和 php 的新手。

 <script language="javascript" type="text/javascript">
 function SetImageName(strName)
 {
 document.getElementById("ImageName").value = strName;
 }
 </script>

 <div id="Images">

 <img src="images/image1.jpg" name="image1.jpg" onclick="SetImageName(this.name)"/></a>
 <img src="images/image2.jpg" name="image2.jpg" onclick="SetImageName(this.name)"/>

 </div><input type="hidden" value="" id="ImageName" name="ImageName"/>
4

3 回答 3

10

可能吗?当然。

在您的 html 标记中:

onclick="SetImageName(this)"

然后在你的 JS 中:

function SetImageName(imgElement) {
    var theName = imgElement.name;
    var theSrc = imgElement.src;
    // etc.

也就是说,当您调用时,使用SetImageName()传递对单击元素本身的引用this,而不仅仅是使用 的名称this.name。然后在您的函数中,您可以根据需要访问其任何和所有属性。

于 2013-03-22T11:40:59.160 回答
2

您可以使用此函数获取图像的“src”:

 document.getElementById("imagename").src

所以你的代码是:

<script language="javascript" type="text/javascript">
    function SetImageProperties(control)
    {
        // Populate hidden fields with properties of the control
        document.getElementById("ImageName").value   = control.name;
        document.getElementById("ImageSource").value = control.src;
    }
 </script>

 <div id="Images">

 <img src="images/image1.jpg" name="image1.jpg" onclick="SetImageProperties(this)"/>
 <img src="images/image2.jpg" name="image2.jpg" onclick="SetImageProperties(this)"/>

 </div><input type="hidden" value="" id="ImageName"   name="ImageName"/>
 </div><input type="hidden" value="" id="ImageSource" name="ImageSource"/>

通过传递

 this

代替

 this.name

您正在传递对整个 DOM 对象的引用。然后,您可以单独使用每个属性,如上面修改后的代码所示。

于 2013-03-22T11:48:22.743 回答
0

当用户单击图像时,该函数SetImageName将通过以下方式调用:

onclick="SetImageName(this)"

意义:

<img src="images/image1.jpg" name="image1.jpg" onclick="SetImageName(this)"/>

SetImageName函数实现你将通过and获取图片的名称和image.namesrcimage.src

于 2013-03-22T11:44:42.030 回答