Динамическая ссылка больше не работает в Chrome

Question

Итак, я работаю над новой системой блога для своего веб-сайта, которую я в конечном итоге надеюсь упаковать как бесплатную загрузку. У меня есть динамические читать больше/меньше ссылок, которые отлично работают в IE и Firefox, но не в Chrome; последний браузер в этом списке отображает запись без эффекта fadeIn, не скрывает сводный диапазон и игнорирует ссылку «читать меньше».

Ниже приведен мой код. Я использую jQuery 1.7.0. Спасибо заранее, любой, кто может дать мне правильный ответ, получит меноген в моем блоге. Я ценю вашу помощь :)

<script type="text/javascript"> 
function readMore(entNo) 
{ 
    $("#entSum" + entNo).fadeOut(function() 
    { 
     $("#ent" + entNo).fadeIn(); 
    }); 

function readLess(entNo) 
{ 
    $("#ent" + entNo).fadeOut(function() 
    { 
     $("#entSum" + entNo).fadeIn(); 
    }); 
} 

function loadPage(startNo,endNo) 
{ 
    $("#blogLoad").fadeOut(function() 
    { 
      $.ajax(
      { 
       url: "getBlog.php", 
       type: "GET", 
       data: {start: startNo, end: endNo}, 
       success: function(data) 
       { 
        $("#blogLoad").html(data); 
        $(".ent").hide(); 
        $("#blogLoad").fadeIn(); 
       } 
      }); 
    }); 
} 

function facebookShare(id) 
{ 
    window.open("http://www.facebook.com/sharer.php?u=http://jamesswright.co.uk/blog.php?id=" + id + "&t=James S. Wright| Blog", "ShareOnFacebook", "width=600,height=400,scrollbars=yes,location=no,status=no,screenx=" + ((screen.width/2) - 300) + ",screeny=" + ((screen.height/2) - 200)); 

} 

function twitterShare(id) 
{ 
    window.open("http://twitter.com/share?url=http://jamesswright.co.uk/blog.php?id=" + id + "&text=Cool blog from James Wright: &via=JamesSWrightWeb", "Twitter", "width=600,height=400,scrollbars=yes, location=no, status=no, screenx=" + ((screen.width/2) - 300) + ", screeny=" + ((screen.height/2) - 200)); 

} 
</script> 
<?php 

$start; 
$end; 

if($_GET["start"] == NULL) $start = 0; 
else $start = $_GET["start"]; 

if($_GET["end"] == NULL) $end = 5; 
else $end = $_GET["end"]; 


$connection = mysql_connect("localhost", "jamwri9_sql", "******"); 
if(!$connection) echo "<p><b>Could not retrieve banner data: database connection failed"; 

mysql_select_db("jamwri9_sql", $connection); 

$query; 
$totalRows; 
if($_GET["id"] == NULL) 
{ 
    $query = mysql_query("SELECT ID, Title, Date, Entry FROM jswBlog ORDER BY ID DESC LIMIT " . $start . ", " . $end); 
    $totalRows = mysql_num_rows(mysql_query("SELECT ID FROM jswBlog")); 
} 
else $query = mysql_query("SELECT Title, Date, Entry FROM jswBlog WHERE ID = " . $_GET["id"] . " ORDER BY ID"); 

$rows = mysql_num_rows($query); 


$i = 0; 
for($i; $i < $rows; $i++) 
{ 
    echo "<p class=\"title\">". mysql_result($query, $i, 'Title') . "</p><p>Posted " . mysql_result($query, $i, 'Date') . "</p>"; 
    if(strlen(mysql_result($query, $i, 'Entry')) > 250 && $_GET["id"] == NULL) echo "<span id=\"entSum" . $i . "\"><p>" . substr(mysql_result($query, $i, 'Entry'), 0, 250) . "... | <a href=\"javascript:void(0)\" onclick=\"readMore(" . $i . ")\">read more >></a></p></span><span id=\"ent" . $i . "\" class=\"ent\"><p>" . mysql_result($query, $i, 'Entry') . " | <a href=\"javascript:void(0)\" onclick=\"readLess(" . $i . ")\"><< read less</a></p></span>"; 
    else echo "<p>" . mysql_result($query, $i, 'Entry') . "</p>"; 
    echo "<p>Share: <a href=\"javascript:void(0)\" onclick=\"facebookShare(" . mysql_result($query, $i, 'ID') . ")\"><img src=\"img/facebook.png\" style=\"vertical-align: middle;\" /></a> <a href=\"javascript:void(0)\" onclick=\"twitterShare(" . mysql_result($query, $i, 'ID') . ")\"><img src=\"img/twitter.png\" style=\"vertical-align: middle;\" /></a> <input type\"text\" value=\"http://jamesswright.co.uk/blog.php?id=" . mysql_result($query, $i, 'ID') . "\" /></p><hr />"; 
} 

if($_GET["id"] == NULL) 
{ 
    echo "<p>Page: "; 
    $pages = $totalRows/5; 
    $j = 0; 
    $startNo = 0; 
    $endNo = 5; 
    for($j; $j < $pages; $j++) 
    { 
     echo "<a href=\"javascript:void(0)\" onclick=\"loadPage(" . $startNo . "," . $endNo . ")\">" . ($j + 1) . "</a>"; 
     if($j < $pages - 1) echo "|"; 
     $startNo += 5; 
     $endNo += 5; 
    } 
    echo "</p>"; 
} 
else echo "<a href=\"blog.php\">View all blog entries</a>"; 
?> 

Answer 1

Просто, чтобы вы знаете, я решил эту проблему. По какой-то причине все версии Google Chrome (моя версия 18.0.1025.162), выпущенные во время публикации этого ответа, не поддерживают видимость элементов, которые изменяются jQuery (не пытались вручную использовать JavaScript, поэтому, возможно, это возможность).

Проще говоря, я заменил элементы <span>, содержащие данные в блоге, с <div>. Задача решена.

На всякий случай вы заинтересованы, блог можно найти here. Я сделаю дальнейшее усовершенствование и надеюсь, что в конечном итоге выпустить бесплатное программное обеспечение в качестве открытого источника.

Answer 2

Я не уверен, если это проблема, но в соответствии с documentationfadeOut() принимает duration в качестве первого параметра, и обратного вызова в качестве второго параметра.

Попробуйте ввести в качестве первого параметра как «медленный», «быстрый» или 400 (количество миллисекунд) и вместо этого передать функцию обратного вызова в качестве второго параметра.

Как это:

function readMore(entNo) 
{ 
    $("#entSum" + entNo).fadeOut("fast", function() 
    { 
     $("#ent" + entNo).fadeIn("fast"); 
    }); 
}