HTML + Javascript表单提交问题

我已经创作了一个html + javascript表单，其中显示了一组图像以及一个提交按钮。用户可以选择他或她感兴趣的图像，并且当用户点击图像时，我改变图像边界以指示图像选择。HTML + Javascript表单提交问题

当用户点击提交按钮时，我希望我的服务器端脚本能够接收与所选图像关联的图像以进一步处理。

我是JS新手。我想知道如何最好地做到这一点。我是否需要一个全局JavaScript数组，并使用选定的图像URI进行填充？然后这个数组可以作为HTTP POST的一部分提交？

任何提示/指针都会有所帮助。

2010-02-10 user270027

如果我是你，我会确保它在没有JavaScript的情况下也能正常工作。例如。

<form action="" method="POST"> 
    <label for="image_1"> 
     <img src="image_1_uri" alt="Image 1" /> 
     <input type="checkbox" name="images" id="image_1" value="image_1_uri" /> 
    </label> 

    <label for="image_2"> 
     <img src="image_2_uri" alt="Image 2" /> 
     <input type="checkbox" name="images" id="image_2" value="image_2_uri" /> 
    </label> 

    <input type="submit" /> 
</form>

然后调整你的边框 - 当点击标签而不是图像时，添加JavaScript工作。

如果你不喜欢他们在那里，通过CSS隐藏复选框。（您需要在复选框中添加一个类，以便在旧版Internet Explorer中执行此操作。）

来源

2010-02-10 08:08:15

谢谢你们。这很有帮助:-) – user270027 2010-02-11 18:03:31

试试这个：

//...let's suppose this is the image you change the border of on click.. 
<img src="whatever" onclick="createHidden(this);" /> 

<script type="text/javascript"> 
    function createHidden(field) 
    { 
    var hdn = document.createElement("input"); 
    hdn.setAttribute('type', 'hidden'); 
    hdn.setAttribute('name', 'hdn[]'); 
    hdn.setAttribute('value', field.src); // populate images src now 

    var frm = document.getElementsByTagName("form")[0]; 
    frm.appendChild(hdn); 
    } 
</script>

现在，您可以访问您的服务器端脚本hdn阵列中的图像的路径。

来源

2010-02-10 05:41:38 Sarfraz

如果我错了，请纠正我，但是不应该通过Form元素的一部分新创建字段？现在它是正文的一部分（在调用submit时没有提交） – Edelcom 2010-02-10 07:05:59

@Edelcom：你说得对，我很想知道这件事，但是当我回答这个问题的时候忘了写下它，谢谢你的支持:) – Sarfraz 2010-02-10 07:41:08

我想你需要用var hdn = document.createElement（'input'）;然后hdn.setAttribute（'类型'，'隐藏'），并从那里继续... – KenB 2011-02-25 20:11:59

HTML + Javascript表单提交问题

回答

相关问题