Question

我正在制作一个简单的新闻模块。有一个表单，用户将多个图像ID添加到一个文本框然后提交它。为了提高可用性，我在一侧列出了他们可以添加的所有图像（旁边显示的ID号）。然而，这仍然有点令人困惑。当用户点击图片时，我希望在文本框中添加/删除图像ID。

免除我的代码，方法，想法，例子......我会采取任何措施。

Answer 1

这样的事情（未经测试）？

var $input = $('#textbox'); // <-- your input field

$('img').click(function() {
    var value = $input.val();
    var id = $(this).attr('id');
    if (value.match(id)) {
        value = value.replace(id, '');
    }
    else {
        value += ' ' + id;
    }
    $input.val(value);
});

Answer 2

创建隐藏输入列表：<input type="hidden" name="photo[ID_HERE]" value="0" />。
创建图片列表：...<li><img src="..." id="photo-123" /> Photo #123</li>...

为那些将改变与图像相关的输入值的图像添加单击事件的侦听器：

$("#images img").click(function() {
   var id = $(this).attr("id").replace(/\D/g, "");
   $("input[name='photo[" + id + "]']").val(Math.abs($("input[name='photo[" + id + "]']").val() - 1));
});

单击图像时，在文本框中添加/删除图像ID

2 个答案: