Question

我有一个我称之为stange问题的东西，虽然它与Internet Explorer（7 8在普通模式和兼容模式下）有关，所以有一个问题并不奇怪!!

我创建了一个分页系统。页面上有按钮[上一页] [下一页] [显示全部] / [显示为页面]

单击按钮时，它使用ajax调用来获取数据并替换div的html。

所有按钮都可以在firefox，safari等中运行，但是只有[show all] [show as pages]按钮才能工作[previous] [next]按钮，只是清空数据。

页面在此处可见： http://www.pimms-transfer-eu.org/index_ietest.php?id_lang=10

这是我的jquery代码：

$(document).ready(function() {
    $id_sec = <?php echo $row_rs_sections['id_sec']; ?>;

    function getBreaks($id_sec ,$id_brk){ // function to get next page and previous page
        var ajax_load = "<img src='img/icons/loadinfo_circle 16x16.gif' alt='loading...' /> Loading data...";
        $("#pbcontent").html(ajax_load);
        $.get('getbreakData.php?id_sec='+$id_sec+'&id_brk='+$id_brk, function(data) {
            $("#pbcontent").empty(); // tried adding this to fix ie prob
            $("#pbcontent").html(data);
        });
    };

    function getAllBreaks($id_sec){ //function to get all pages
        var ajax_load = "<img src='img/icons/loadinfo_circle 16x16.gif' alt='loading...' /> Loading data...";
        $("#pbcontent").html(ajax_load);
        $.get('getbreakData.php?id_sec='+$id_sec+'&showall=true', function(data) {
            $("#pbcontent").html(data);
        });
    };
    //using live as buttons are page loaded via ajax
    $('.showAllButton').live('click', function(){
        $id_brk = $(this).attr('rel');
    getAllBreaks($id_sec, $id_brk);
    });

    $('.showAsPagesButton').live('click', function(){
    $id_brk = $(this).attr('rel');
    getBreaks($id_sec, 0);
    });

    $('.prevButton').live('click', function(){
    $id_brk = $(this).attr('rel');
    getBreaks($id_sec, $id_brk);
    });

    $('.prevButton').live('hover', function () {
        this.src = '/img/icons/prev_on.gif';
    }, function () {
        this.src = '/img/icons/prev_off.gif';
    });

    $('.nextButton').live('click', function(){
    $id_brk = $(this).attr('rel');
    getBreaks($id_sec, $id_brk);
    });

    $('.nextButton').live('hover', function () {
        this.src = '/img/icons/next_on.gif';
    }, function () {
        this.src = '/img/icons/next_off.gif';
    });

    getBreaks($id_sec ,0); // load page
});

以及通过ajax调用的代码：

    <?php require_once('Connections/pimms.php'); ?>
    <?php
    // Require the MXI classes
    require_once ('includes/mxi/MXI.php');

    if (!function_exists("GetSQLValueString")) {
    function GetSQLValueString($theValue, $theType, $theDefinedValue = "", $theNotDefinedValue = "") 
    {
      $theValue = get_magic_quotes_gpc() ? stripslashes($theValue) : $theValue;

      $theValue = function_exists("mysql_real_escape_string") ? mysql_real_escape_string($theValue) : mysql_escape_string($theValue);

      switch ($theType) {
        case "text":
          $theValue = ($theValue != "") ? "'" . $theValue . "'" : "NULL";
          break;    
        case "long":
        case "int":
          $theValue = ($theValue != "") ? intval($theValue) : "NULL";
          break;
        case "double":
          $theValue = ($theValue != "") ? "'" . doubleval($theValue) . "'" : "NULL";
          break;
        case "date":
          $theValue = ($theValue != "") ? "'" . $theValue . "'" : "NULL";
          break;
        case "defined":
          $theValue = ($theValue != "") ? $theDefinedValue : $theNotDefinedValue;
          break;
      }
      return $theValue;
    }
    }

    $MMID_rs_pagebreaks = "0";
    if (isset($_GET['id_sec'])) {
      $MMID_rs_pagebreaks = $_GET['id_sec'];
    }
    mysql_select_db($database_pimms, $pimms);
    $query_rs_pagebreaks = sprintf("SELECT * FROM sections_sec WHERE id_sec = %s", GetSQLValueString($MMID_rs_pagebreaks, "int"));
    $rs_pagebreaks = mysql_query($query_rs_pagebreaks, $pimms) or die(mysql_error());
    $row_rs_pagebreaks = mysql_fetch_assoc($rs_pagebreaks);
    $totalRows_rs_pagebreaks = mysql_num_rows($rs_pagebreaks);
    $id_sec = $row_rs_pagebreaks['id_sec'];
    ?>
    <?php 
        // set up the vars

        //store the content for the page in $str
        $str = $row_rs_pagebreaks['text_sec'];  
        // break up the content into pages
        $myPages = explode('<div style="page-break-after: always;">',$str);
        // get the number of pages
        $pageCount = count($myPages);
        // array starts from 0 so create values for the display counter +1
        $pageCountHR = $pageCount;
        // set default to the first page ($page = 0)
        $page = 0;
        //set the default to the display counter
        $pageHR = $page+1;

        // set the page to the page requested if it has been passed
        if (isset($_GET['id_brk'])) {
            $page = $_GET['id_brk'];
            //set the value to the display counter
            $pageHR = ($page+1);
        };
        // set up the next and previous links
        $nextLink = $page +1;
        $prevLink = $page -1;

        // echo the results
        /*
        echo('pagecount in array = '.$pageCount.'<br>');
        echo('hr pagecount = '.$pageCountHR.'<br>');
        echo('page in array = '.$page.'<br>');
        echo('hr page = '.$pageHR.'<br>');
        echo('prev page = '.$prevLink.'<br>');
        echo('next page = '.$nextLink.'<br>');
        */

        // set wether to show all pages or not
        $showAll = false;
        if (isset($_GET['showall'])) {
            $showAll = $_GET['showall'];
        };
        // set the page to display
        $pagetoprint = $myPages[$page];

    ?>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <link href="css/pagebreaks2.css" rel="stylesheet" type="text/css" />
    <script src="Scripts/development-bundle/jquery-1.4.2.js" type="text/javascript"></script>
    <script src="Scripts/roundedcorners.js" type="text/javascript"></script>
    <script type="text/javascript">
    $(document).ready(function() {
      $('.pagingInfo').corner();
      $('.navButton_on').corner();
    });

    </script>
    </head>

    <body>

    <?php if($pageCount > 1){?>
    <div id="navBar">
        <?php if ($page != 0){?>

          <div id="navitem">
                <?php if($showAll == false){?>
                <img src="/img/icons/prev_off.gif" alt="To Left" width="21" height="15" class="prevButton" rel="<?php echo($prevLink);?>"/>
             <?php };?>      
          </div>
       <?php }else{?>
            <div class="noButton"></div>
       <?php };?>

        <?php if($showAll == false){?>
          <div class="pagingInfo">
             Page <?php echo($pageHR);?> of <?php echo($pageCountHR);?>
          </div>
       <?php };?>
       <?php if ($pageHR < $pageCountHR){ ?>
      <div id="navitem">
      <?php if($showAll == false){?>
        <img src="/img/icons/next_off.gif" alt="To Right" name="NavRight" class="nextButton" id="NavRight" rel="<?php echo($nextLink); ?>"/>  
        <?php };?>
        </div>
          <?php }else{ ?>
             <div class="noButton"></div>
          <?php }; ?>
       <?php if ($showAll == false){?>
        <div class="showAllButton navButton_on">
            Show All Pages
        </div>
       <?php };?>
       <?php if ($showAll == true){?>
        <div class="showAsPagesButton navButton_on">
            Show As Pages
        </div>
       <?php };?>
    </div>
    <br />
    <br />

    <?php };?>
    <h1><?php echo $row_rs_pagebreaks['name_sec']; ?></h1>
        <?php 
          if ($showAll == true){
             echo($str);
          }else{
             echo($pagetoprint);
       };?>
    <?php if($pageCount >1){?>
    <div id="navBar">
        <?php if ($page != 0){?>

          <div id="navitem">
                <?php if($showAll == false){?>
                <img src="/img/icons/prev_off.gif" alt="To Left" width="21" height="15" class="prevButton" rel="<?php echo($prevLink);?>"/>
             <?php };?>      
          </div>
       <?php }else{?>
            <div class="noButton"></div>
       <?php };?>

        <?php if($showAll == false){?>
          <div class="pagingInfo">
             Page <?php echo($pageHR);?> of <?php echo($pageCountHR);?>
          </div>
       <?php };?>
       <?php if ($pageHR < $pageCountHR){ ?>
      <div id="navitem">
      <?php if($showAll == false){?>
        <img src="/img/icons/next_off.gif" alt="To Right" name="NavRight" class="nextButton" id="NavRight" rel="<?php echo($nextLink); ?>"/>  
        <?php };?>
        </div>
          <?php }else{ ?>
             <div class="noButton"></div>
          <?php }; ?>
       <?php if ($showAll == false){?>
        <div class="showAllButton navButton_on">
            Show All Pages
        </div>
       <?php };?>
       <?php if ($showAll == true){?>
        <div class="showAsPagesButton navButton_on">
            Show As Pages
        </div>
       <?php };?>
    </div>
    <br />
    <br />

    <?php };?>


    </body>
    </html>
<?php
    mysql_free_result($rs_pagebreaks);
?>

修改

我查看了文档类型，以防出现问题我想我已经在两个文件上正确设置了它： getbreakdata.php：
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
index_ietest.php：
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />

Answer 1

你试图将另一个页面的整个<html>块放在<div>内... IE不会那样。

There are other issues as well，在您的来源中重复使用ID和无法匹配的</div>，IE也无法容忍。主问题是未关闭的</div> which doesn't exist in the Show All version。但为什么不解决所有问题呢？：）

您可以使用$.get()代替.load()来代替页面的一部分从服务器获取内容，而不是{{3}}，例如：

$("#pbcontent").load('getbreakData.php?id_sec='+$id_sec+' #container');

这会仅将#container加载到#pbcontent，同时丢弃所请求页面的其余部分。

Answer 2

我以前遇到过同样的问题。在IE中，JQuery live方法不适用于某些AJAX生成的内容。所以我使用了JQuery livequery插件。

Answer 3

谢谢杰克指出缺少的div元素是一个很大的帮助。帮我找到问题!!

要显示的内容是从数据库中提取的，代码将内容拆分为导致错误的单独页面。

$myPages = explode('<div style="page-break-after: always;">',$str);

应该是什么时候：

$myPages = explode('<div style="page-break-after: always;"><span style="display: none;">&#160;</span></div>',$str);

现在，分页符的结束div一切都很好。

会将http://validator.w3.org/添加到我的工具列表中!!!

jquery .html（）没有显示在ie中在firefox中正常工作

3 个答案: