的onClick模态对话框

Question

类似：jquery modal dialog onclick?

但是我有不同的要求，不能应用在该职位所提供的解决方案。

在我使用PHP内的JQuery 通过XML文件来分析和HTML网页制作内容的时刻：

<script type="text/javascript"> 
     $(document).ready(function(){ 
      $.ajax({ 
       type: "GET", 
       url: "uploads/data.xml", 
       dataType: "xml", 
       error: function() { 
        $('#message').text('Please upload the XML file.'); 
       }, 
       success: xmlParser 
      }); 
     }); 

     function xmlParser(xml){ 
      $('.tmpli').hide(); 


      $(xml).find("vendor-one").each(function(){ 
       $("#vendor-one").append('<li class="sweet">' + $(this).find("name").text() + '</li>'); 
       $(".sweet").fadeIn(); 
      }); 

     } 
    </script> 

我试图通过onClick触发警报但是它不能够包含图像：

$(xml).find("vendor-one").each(function(){ 
    $("#vendor-one").append('<li class="sweet" onClick="alert(\''+$(this).find("name").text()+'\');">' + $(this).find("name").text() + '</li>'); 
    $(".sweet").fadeIn(); 
}); 

我然后试图这样但它打开了页面上的每个li元素一个对话框，我不能确定如何编辑文本，并添加图片：

$(xml).find("vendor-one").each(function(){ 
    $("#vendor-one").append('<li class="sweet">' + $(this).find("name").text() + '</li>'); 
    $(".sweet").fadeIn(); 
    $('li.sweet').click(function(){ $('li.sweet').dialog(); }); 
}); 

我需要的设施在那里我可以点击创建每一个人li项目，并有一个消息框出现包含图像和文字。 我打算使用这个：Modal Dialog但是我不确定如何修补它以满足我的需求。

你是如何做到这一点的？

Answer 1

除了使用手动onclick内嵌选项，您可以使用Javascript方式来完成它。

document.getElementById('ElementID').addEventListener('click', function(event){ 
    console.log(event); 
}); 

或者JQuery的方式（这会导致同样的事情）：第一

$('#ElementID').click(function(event){ 
    console.log(event); 
});