Ajax响应中的javascript在Firefox，Chrome，Opera中有效，但不能在Internet Explorer 11中运行-对象不支持此属性或方法

Question

我试图在其他帖子中找到我的问题的答案，但不幸的是我找不到任何解决问题的方法。

因此，我试图通过AJAX请求一个jQuery Datepicker。 我在这里上传了示例。 您可以在Firefox，Chrome或Opera中查看工作示例：

不幸的是，这在Internet Explorer 11中不起作用。

<!DOCTYPE html>
<html lang="en">
 <head>
 <meta charset="utf-8">
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
 <meta name="viewport" content="width=device-width, initial-scale=1">

 <link rel="stylesheet" href="css/jquery-ui.css"/>

 <script type="text/javascript" src="js/jquery-1.11.3.min.js"></script>
 <script type="text/javascript" src="js/jquery-ui.js"></script>  
 <script type="text/javascript" src="js/scripts.js"></script>  

 </head>
 <body>
    <h1>Json javascript example</h1>
    <button id="requestHtml" onclick="callAjax()">request new HTML</button>
    <div id="emptyDiv"></div>     
 </body>
</html>

javascript代码如下所示：

function callAjax()
{
    $.ajax({
            url: "/htmlJson.php",
            dataType: 'json',
            cache : false,
            type: 'post',
            data: '',
            error: function(){
                alert("Error in Ajax response");
            },
            success: function(response)
            {
                $("#emptyDiv").html(response.htmlCode);
            }
    });
}

最后是htmlJson.php中的代码：

<?php
$json = array(
    'success' => true,
    'htmlCode' => ""
);


$data = '
    <div class="form-group">
        <input type="text" id="Birthdate" class="form-control" style="background-color:#ffffff; color:gray" value="Birthdate" readonly placeholder="Birth date" />
    </div>                         
    <script>
    $("#Birthdate").datepicker({
        changeMonth: true,
        changeYear: true,
        timeFormat: "HH:mm:ss",
        dateFormat: "yy-mm-dd"
    }); 
    </script>
';

$json['success'] = true;
$json['htmlCode'] = $data;

echo json_encode($json);

?>

当我在Firefox，Chrome和Opera中运行此程序时，它可以完美运行，并且在单击生日日期表单时，日期选择器会显示出来。 但是，在Internet Explorer 11中，它以评估代码显示警报：

  Object does not support this property or method

我读过，不应该在ajax响应中混用html代码和javascript代码。 但是，我在其他示例中也看到了这种方法。

从其他答案中，我还尝试将javascript代码直接放入成功回调函数中。 不幸的是，相同的行为。 在Firefox，Chrome和Opera中都可以使用，但在Internet Explorer 11中则没有。它再次表明该元素不支持该方法。

谢谢您的帮助！

干杯斯特凡

更新

我只是发现，如果让它在XAMPP上本地运行，则它可以在IE11中顺利运行。 这个问题可能与某些服务器设置有关吗？

Answer 1

如果您仍然想通过Ajax返回混合的html + js代码，请尝试将js jQuery代码包装到jQuery.ready事件处理程序中，如下所示：

jQuery(document).ready(function($) {
  $("#Birthdate").datepicker({
        changeMonth: true,
        changeYear: true,
        timeFormat: "HH:mm:ss",
        dateFormat: "yy-mm-dd"
    }); 
});

UPD

这是更新的版本：

1）从响应/htmlJson.php中删除JS代码

2）相应地修改您的scripts.js

 //code for scripts.js
function initDatePicker(){

  $("#Birthdate").datepicker({
            changeMonth: true,
            changeYear: true,
            timeFormat: "HH:mm:ss",
            dateFormat: "yy-mm-dd"
        }); 
}

function callAjax()
{
    $.ajax({
            url: "/htmlJson.php",
            dataType: 'json',
            cache : false,
            type: 'post',
            data: '',
            error: function(){
                alert("Error in Ajax response");
            },
            success: function(response)
            {
                $("#emptyDiv").html(response.htmlCode);
   initDatePicker();
            }
    });
}

UPD2

  jQuery(document).ready(function($) {

   var initDatePicker = function(){
            $("#Birthdate").datepicker({
                  changeMonth: true,
                  changeYear: true,
                  timeFormat: "HH:mm:ss",
                  dateFormat: "yy-mm-dd"
              }); 
        }


    var callAjax = function() {

        $.ajax({
                url: "htmlJson.php",
                dataType: 'json',
                cache : false,
                type: 'post',
                data: '',
                error: function(){
                    alert("Error in Ajax response");
                },
                success: function(response)
                {
                    $("#emptyDiv").html(response.htmlCode);
                    initDatePicker();

                }
        });
    }

  });

Ajax响应中的javascript在Firefox，Chrome，Opera中有效，但不能在Internet Explorer 11中运行-对象不支持此属性或方法

问题描述

1 个解决方案

解决方案1
1 已采纳 2015-06-24 12:12:37

Ajax响应中的javascript在Firefox，Chrome，Opera中有效，但不能在Internet Explorer 11中运行-对象不支持此属性或方法

问题描述

1 个解决方案

解决方案1 1 已采纳 2015-06-24 12:12:37

解决方案1
1 已采纳 2015-06-24 12:12:37