Question

我获得每个a元素的标题，但不能将其放在#dialog标题中。它仅适用于第一个a元素，下一个元素不起作用。

这是一个小画廊，在弹出对话框中单击时，我看到一个大图像，但标题未更改。我不明白我的错误在哪里。

<script src="https://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/ui-lightness/jquery-ui.min.css" />
<script type="text/javascript">
PreviewImage = function(uri,xtitle) {    // main function xtitle here
  imageDialog = $("#dialog");
  imageTag = $('#image');                // big image src
  uriParts = uri.split("/");
  imageTag.attr('src', uri);             // get src
  imageTag.load(function(e){
    $('#dialog').dialog({
      modal: true,
      resizable: false,
      draggable: false,
      width: '800px'
      // open: function(e) {                 // I thinks this code does not work
      //   $(".ui-dialog-title").text(xtitle);
      //   if (xtitle.length != 0) {
      //     $(".ui-dialog-title").text(xtitle + ": ");
      //   }
      // }
    });
  });
}
$(document).ready(function() {
  $('body a.popup').click(function (event) {
    var xtitle = $(this).attr('title'); // this get each element title
    alert($(this).attr('title'));       // alert works fine
    event.preventDefault();
    PreviewImage($(this).attr('href'),xtitle);
    return false;
  });
});
</script>
<div id="dialog" title="empty title" style="display:none;">
  <img id="image" src="" style="max-width:100%;" />
</div>
<div class="col-sm-2"><a id="image1" class="popup" title="img one" href="r.jpg" target="_blank"><img src="l1.jpg" alt="img one" title="one one">one</a></div>
<div class="col-sm-2"><a id="image2" class="popup" title="title z" href="1.jpg" target="_blank"><img src="l2.jpg" alt="">text2</a></div>

Answer 1

$（this）仍然绑定到a.popup。尝试使用

$(this).find("img").attr('title');

Answer 2

您应该使用title的{{1}}属性，而不要尝试通过.dialog()选择器进行设置...

请参见下面的代码。

$(".ui-dialog-title")

jQuery-ui dialog documentation

jQuery Dialod从许多“ a”更改标题不起作用

2 个答案: