Question

我有一个用户可以在聊天室聊天的表单。我的问题是我有一个用户可以选择图片的画廊。

我的问题是用户如何点击html链接以及该html链接将文本输入到输入中，以便当用户点击显示cat的链接时，它会输入文本字段:cat 。

这是我到目前为止的表格：

<form method="POST" action="chat.php">
  <input type="text" name="message"></input>
  <input type="submit" />
</form>

这是画廊：

<a href="#"><img src="cat.jpg"/></a>

再次，问题是，一旦用户点击猫的图像，我怎么能在文本框中插入文字？

感谢任何花时间帮助我解决此问题的人。

Answer 1

如果你正在使用 jQuery ，你可以这样做：

$('a.cat').click(function()
{
    $('input[name="message"]').val(':cat');
});

在这种情况下，您需要使用以下内容更新链接：

<a class="cat" href="#"><img src="cat.jpg"/></a>

Answer 2

这是JS（没有jQuery）的解决方案： http://jsbin.com/doqedodezo/3/edit?html,js,output

图像触发JS函数并传递应该添加到输入字段的文本。我在输入中添加了一个id来解决它。

Answer 3

您可以创建一个js函数，然后使用锚点调用它来更改输入的value属性。输入类型文本也不应该有结束标记。

function changeChatInput(value) {
  document.getElementById('chatInput').value = value;
}

<form method="POST" action="chat.php">
  <input type="text" name="message" id="chatInput" />
  <input type="submit" />
</form>


<a href="javascript: changeChatInput(':cat');">
  <img src="cat.jpg" />
</a>

Answer 4

我使用

$('a > img').click(function() {
    var imgName = retrieveImgName($(this).attr('src'));
    $('input[name="message"]').val(':' + imgName);
});

var retrieveImgName = function(imgPath) {
    return imgPath.substring(0, imgPath.indexOf('.'));
};

这样做，您可以根据src的{{1}}属性提取检索名称的逻辑。所以，如果逻辑由于某种原因而改变，你可以很容易地解决它。

Answer 5

您可以使用此 jQuery 语法来完成工作。

<script type="text/javascript">
$('a > img').click(function(e){
   e.preventDefault();
   $('input[name="message"]').val(':cat');
});
</script>

单击后将数据输入文本框

5 个答案: