Question

我在我的页面添加了一个小函数，当你单击一个按钮时，它会在某个类之后在页面上添加相应的图像。

我已经尝试了几种解决这个“基本”问题的方法。我已经在这个问题上工作了两天而没有运气。

点击我的按钮进行一些互动后，我很快就收到了'Aw，Snap！'来自谷歌的错误。我知道我的电脑可以处理抓取少量图像并在页面上显示它们。

这是我的代码的一部分，最有可能造成麻烦。我已经尝试从我的代码中取出这部分并且它有所帮助。我没有收到错误消息，但显然已停止执行我想要的内容。

  var elem;
    function placeImg(type) {

    //creates and sets attributes for an img
    elem = document.createElement("img");
    elem.setAttribute("src", type+".png");
    elem.setAttribute("height", "50");
    elem.setAttribute("width", "40");
    elem.setAttribute("alt", type +' logo image');

    //puts image after the class original, its an input area
    //there is only one class tag with the name original
    $('#original').after(elem);


 }


 // when an ids with these names are clicked
 $("#arrow, #barber,  #gas, #lion, #none").click(function() {

    //checks if the current input area has a length of 12 or less
    if($('#'+findCurrentEditor()).val().length <=12){
        placeImg(this.id);  //places the image somewhere
    } 

 });

我很感激任何愿意尝试和帮助的人。

谢谢！

Answer 1

我只帮助您使用jQuery创建图像，并通过单击按钮将其添加到div中。其余的，你可以弄明白，因为它只是一些常见的逻辑。

$(".btn").on("click", function() {
    var $image = $('<img />').attr({
        src: 'https://c7.staticflickr.com/6/5820/30597229222_119e91f7e4_k.jpg',
        height: "300",
        width: "400"
    })
    $("div#img-wrapper").html($image);
});

请参阅DEMO

如何在点击时创建图像并将图像添加到我的页面？

1 个答案: