Question

我只想说我不了解javascript或其亲属。我刚刚复制了我正在使用的代码。话虽如此，让我们继续前进。

我必须达到的目标：
当用户输入页面时，他们需要在页面上显示的图像上设置标记并提交表单。

到目前为止我做了什么：
- 在单击任何位置的图像上设置标记
- 存储此标记的x-y坐标 - 如果点击

，请删除标记

我需要你的帮助：
- 删除已删除标记的存储x-y坐标

代码：

$(document).ready(function() {
  $("#target").click(function(e) {
    var x = e.pageX - this.offsetLeft - 8;
    var y = e.pageY - this.offsetTop - 8;

    $("#img_val").val(function(index, val) {
      return val + "(" + (x + 8) + "-" + (y + 8) + ")";
    });

    $('<img/>').click(function() {
      $(this).remove();
      return false;
    }).attr({
      src: 'https://upload.wikimedia.org/wikipedia/en/thumb/c/c3/NotCommons-emblem-copyrighted.svg/50px-NotCommons-emblem-copyrighted.svg.png',
      'class': 'added_image',
      id: $("img.added_image").length + 1
    }).
    css({
      'top': y,
      'left': x,
      'z-index': '10'
    }).appendTo('#target');
  });
})

#target {
  position: relative;
  width: px;
}

.added_image {
  position: absolute;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="target">
  <img src="https://upload.wikimedia.org/wikipedia/commons/4/47/PNG_transparency_demonstration_1.png" alt="Some useful text here" />
</div>

<!-- This is where I store the x-y-coordinates -->
<!-- On the real page it's type is "hidden" -->
<input type="text" name="img_val" id="img_val" value="" style="width: 90%;" />

http://jsfiddle.net/pUeue/3675/

如何传递“javascript编辑”的图像

0 个答案: