无法使用javascript将Img-src复制到隐藏的输入值

Unable to copy Img src to hidden input value using javascript

本文关键字：隐藏 输入 复制 Img-src javascript      更新时间：2024-05-01

下面是一个html/javascript代码，我用它将图像拆分为2。从下面的代码中，你可以看到图像是通过运行我的JS代码动态创建的，并附加在中

<div id="output"></div>

执行javascript以"分割"图像后，结果看起来像（单击此处查看调试代码）。

现在我想将"img src"值（如上面的调试代码所示）添加到一个隐藏的输入类型中。我已经编写了JS函数"copySRC（）；"，它将在单击提交按钮时执行。然而，在JS脚本的调试过程中，img src值没有复制到"隐藏输入类型"的value属性。

我似乎找不到这个问题。

（注意：我在一个单独的测试html/js代码中尝试了该代码，它有效，但现在出现了问题）

请协助。谢谢大家：）

JS代码的代码段

function copySRC()
{
    var img_left_data = document.getElementsByName("Image_Left").src;
    var img_right_data = document.getElementsByName("Image_Right").src;
    document.getElementsByName("img_left_D").value = img_left_data;
    document.getElementByName("img_right_D").value = img_right_data;
}

CSS

#output_container 
{
    display: none;
}
#output img 
{
    border: gray 1px solid;
    padding: 2px;
    margin: 5px;
}

html

<form action="" method="POST">
<div id="output_container">
    <h2>Output</h2>
    <div id="output"></div>
    <input type="hidden" id="img_hidden_data" name="img_left_D" value="123"/>
    <input type="hidden" id="img_hidden_data" name="img_right_D" value="123"/>
    <input type="submit" value="send" onclick="copySRC();"/>
</div>

getElementsByName()返回一个集合。你想做的事：

function copySRC()
{
    var img_left_data = document.getElementsByName("Image_Left")[0].src;
    var img_right_data = document.getElementsByName("Image_Right")[0].src;
    document.getElementsByName("img_left_D")[0].value = img_left_data;
    document.getElementsByName("img_right_D")[0].value = img_right_data;
}

如果你尝试获取src，它应该返回带有域名的整个图像路径，代码看起来不错，你可以尝试使用getAttribute，它只会返回src属性中提到的内容。

<img src="smiley.gif" alt="Smiley id="im" name="simg" face" width="42"  height="42" />
<input type="hidden" name="ih" />
<input type="button" value="copy" onclick="docpy()" />
<script type="text/javascript">
 function docpy()
  {
    var imgSrc = document.getElementsByName("simg");
    var hrc = document.getElementsByName("ih");
    hrc[0].value =   imgSrc[0].getAttribute("src");
    alert(hrc[0].value);
  }
相关文章：