Question

让我首先确定我对jquery很新。我已经使用了一个月左右，现在取得了一定的成功。我希望我的问题很容易回答。

基本上，我在页面上有一个对话框，其中包含在DWR Ajax调用中生成的内容。我想要做的是在我的内容中定义几个div，这样当单击标题div时，第一个引用的第二个div标签需要通过引用的div上的jquery slideToggle函数隐藏/显示。尽管我可能会尝试，但我无法调用此方法。

以下是我调用的javascript方法，请注意，出于测试目的，我省略了dwr ajax调用，并在showdialog方法中手动设置html。

该对话框打开正常，并按预期显示我的内容。但是，单击包含扩展标题类的div不会切换引用的“ELEMENT_ONE”div的视图。

任何想法或评论都会非常感激。我确信我做的事情很傻，但对于我的生活，我无法解决这个问题。

的Javascript

function showdialog() {

var data = '<DIV class="expansion-header" reference="ELEMENT_ONE">'
        + '<B>Click to Toggle Element One<B></DIV>' 
        + '<DIV id="ELEMENT_ONE" name="ELEMENT_ONE">'
        + 'This is element ones text it contains a<BR>few lines of gibberish.<BR><BR>'
        + 'This is the second paragraph to be hidden when the header is clicked</DIV>';

  $("#StatusDialog").html(data);
  $("#StatusDialog").dialog("open");   
}

$(document).ready(function() {

  $(".expansion-header").click(function () {
    var reference = $(this).attr('reference');
    $("#" + reference).slideToggle(400);
  });

  $("body").append('<div id="StatusDialog" title="Dialog Title"></div>');
  $("#StatusDialog").dialog({  
    autoOpen: false,    
    resizable: true,
    width: 750,
    modal: false           
  });    
});

HTML

<div id="status" class="status" style="cursor: pointer; cursor: hand;" onclick="showdialog()">Click Me</div>

Answer 1

您已在.expansion-header存在之前定义了点击事件！

应附加showdialog()

中的点击事件

或考虑使用.live()

绑定它

Answer 2

我相信当你显示一个对话框时，你看到的html实际上是你正在查看的页面的一部分。因此，您应该能够像任何其他jquery选择器一样浏览DOM中的元素。例如，您应该能够说：

$('#ELEMENT_ONE').Html('<p>New Content</p>');

Answer 3

this here有效

$（document）.ready（function（）{

$（“。expansion-header”）。live（'click'，function（）{
var reference = $(this).attr('reference');
$("#" + reference).slideToggle(400);  
}）;

$（ '＃状态'）。点击（函数（）{

var data =''               +'点击切换元素一'               +''               +'这是元素文本，它包含几行乱码。

'               +'这是单击标题时要隐藏的第二个段落;
$("#StatusDialog").html(data);
$("#StatusDialog").dialog("open");  
}）;

$（ “正文”）附加（ ''）。     $（ “＃StatusDialog”）。对话框（{
      autoOpen：false，
      可调整大小：是的，       宽度：750，       莫代尔：假     }）;
  }）;

如何在jquery对话框中选择元素

3 个答案: