0

基本上如果有这个工作。它打开一个查询对话框

$("#opener").click(function() {
    $.ajax({
        url: "hello.php",
        success: function(data) {
            $("#dialog").html(data).dialog("open");
        }
    });

    $("#dialog").dialog({
        bgiframe: true,
        autoOpen: false,
        height: 400,
        width: 400,
        modal: true
    });
});​

我想从

onClick="callMyFuncion(withDetails);

并且基本上使用 myDetails 发送一个 ajax 获取请求。这就是我正在尝试的

function getDayDetails(details) {
    $.ajax({
        type: "GET",
        data: details,
        url: "hello.php",
        success: function(data) {
            $("#dialog").html(data).dialog("open");
        }
    });

    $("#dialog").dialog({
        bgiframe: true,
        autoOpen: false,
        height: 400,
        width: 400,
        modal: true
    });
};​

并从这里调用它

<td class="everyday" onClick="getDayDetails(monthID=<?php echo $month; ?>&dayID=<?php echo $day_num; ?>&yearID=<?php echo $year; ?>);">

我是 Javascript/Jquery 的新手。感谢您的帮助

4

5 回答 5

2

我相信您选择使用内联 JavaScript，因为您无法将其动态化。

另一种方法是使用data-*属性来保存日期值。如下所示：

<td class="everyday"
    data-month="<?php echo $month; ?>"
    data-day="<?php echo $day_num; ?>"
    data-year="<?php echo $year; ?>">
  ...
</td>

并继续使用该.click()函数而不是内联 JavaScript [如告知的那样]，应该更好地避免这种情况。

$("td.selector").click(function() {
  var data = $(this).data();
  $.ajax({
    type: "GET",
    url: "hello.php",
    data: { monthID: data.month, dayID: data.day, yearID: data.year },
    success: function(data) {
      $("#dialog").html(data).dialog("open");
    }
  });
});​

作为对象传递data的优点是 jQuery 会自动对参数进行编码。$.ajax

最后，您可以将.dialog()初始化移动到一个.ready()函数中。

$(document).ready(function() {
  $("#dialog").dialog({
    bgiframe: true,
    autoOpen: false,
    height: 400,
    width: 400,
    modal: true
  });
});
于 2012-12-06T21:23:32.560 回答
2

Ajax 是异步的.. 所以它不会以这种方式工作 ..

尝试这个

$(function(){ // In the DOM ready
              // define the code for the dialog
    $("#dialog").dialog({
        bgiframe: true,
        autoOpen: false,
        height: 400,
        width: 400,
        modal: true
    });
});​

function getDayDetails(details) {
    $.ajax({
        type: "GET",
        data: details,
        url: "hello.php",
        success: function(data) {
            $("#dialog").html(data).dialog("open");
            // Add the new HTMl to the dialog and then open..
        }
    });
}
于 2012-12-06T21:10:19.580 回答
0

为了避免使用所有这些奇怪的 onClick spaggeti 代码，一个更好的方法是通过使用数据属性将参数包含在 DOM 中。例如，您的 td 可能变为：

<td data-day="Mon" data-month="june">

因此，您可以获取如下参数：

$('td').on('click', function() {
     var day = $(this).attr('data-day');
     //And so on 
     //Add them to a data object 
     var data = {}; 
     data.day = day; 
     //Fire your ajax submitting the data object, 

});

最后，由于 ajax 是异步的，您必须将对话代码放在成功回调中。

玩得开心。

于 2012-12-06T21:15:37.757 回答
0

PHP 生成的结果参数是一个字符串。所以你也应该用引号括起来。

<td class="everyday" onClick="getDayDetails('monthID=<?php echo $month; ?>&dayID=<?php echo $day_num; ?>&yearID=<?php echo $year; ?>');">
于 2012-12-06T21:12:25.020 回答
0

如果我正确理解您的问题，那是因为data参数不正确。
它应该看起来像：

data: { monthID:monthValue, dayID:dayValue, yearID:yearhValue }
于 2012-12-06T21:12:41.033 回答