个人中心
gpt4 book ai didi

ajax分页和flowplayer插件之间的javascript冲突

转载 作者：行者123 更新时间：2023-11-28 08:38:22 26 4
gpt4 key购买 nike

我在我的网络项目中应用了ajax分页，它运行良好，但是我的flowplayer插件停止工作了，我认为它们存在冲突，或者它们正在覆盖彼此的javascript，所以我在网络中搜索了一段时间，但我找不到解决方案。 (我什至尝试过 noConflict 方法)我应该怎么办 ？有人可以帮我吗？这是我的index.php:

<?php                   
// This first query is just to get the total count of rows
$sql = "SELECT id_video FROM video ORDER BY id_video DESC";
$res = $connexion->query($sql);
$count=$res->rowCount();
//print_r($count);
// Here we have the total row count
//$total_rows = $row[0];
// Specify how many results per page
$rpp = 4;
// This tells us the page number of our last page
$last = ceil($count/$rpp);
// This makes sure $last cannot be less than 1
if($last < 1){
    $last = 1;
}


?>
<!DOCTYPE html>
<html lang="fr">
<head>
<title>Exemple</title>
<meta charset="utf-8" />
<link rel="stylesheet" href="css/reset.css" />
<link rel="stylesheet" href="css/typocolor.css" />
<link rel="stylesheet" href="css/index_media_ie.css" />

<link rel="shortcut icon" href="image/favicon.ico" />
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600&amp;subset=latin,latin-ext,cyrillic-ext' rel='stylesheet' type='text/css'>


<script>
$(document).ready(function()
{


    flowplayer(".player", "./flowplayer/flowplayer-3.2.16.swf",{

     clip:  {
              autoPlay: false,
              autoBuffering: false
            }


    });

}); 
</script>   

<script type="text/javascript"  >

var rpp = <?php echo $rpp; ?>; // results per page
var last = <?php echo $last; ?>; // last page number
function request_page(pn){
    var results_box = document.getElementById("results_box");
    var pagination_controls = document.getElementById("pagination_controls");
    results_box.innerHTML = "loading results ...";
    var hr = new XMLHttpRequest();
    hr.open("POST", "pagination_parser.php", true);
    hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    hr.onreadystatechange = function() {
        if(hr.readyState == 4 && hr.status == 200) {
            var dataArray = hr.responseText.split("||");
            var html_output = "";
            for(i = 0; i < dataArray.length - 1; i++){
                var itemArray = dataArray[i].split("|");
                html_output += "<li>";
                html_output += "<article>";
                html_output += "<h3>"+itemArray[0]+"</h3>";
                html_output += "<a class=\"player\" href="+itemArray[1]+" style=\"border:1px solid #bfbfbf;display:block;width:90%;height:250px;position:relative;margin:auto;padding:5px;background-color:white;box-shadow: 0px 0px 5px rgb(204, 204, 204);\"></a>";
                html_output += "<p>"+itemArray[2]+"</p>";
                html_output += "</article>";
                html_output += "</li>";
            }
            results_box.innerHTML = html_output;
        }
    }
    hr.send("rpp="+rpp+"&last="+last+"&pn="+pn);
    // Change the pagination controls
    var paginationCtrls = "";
    // Only if there is more than 1 page worth of results give the user pagination controls
    if(last != 1){
        if (pn > 1) {
            paginationCtrls += '<button onclick="request_page('+(pn-1)+')">&lt;</button>';
        }
        paginationCtrls += ' &nbsp; &nbsp; <b>Page '+pn+' of '+last+'</b> &nbsp; &nbsp; ';
        if (pn != last) {
            paginationCtrls += '<button onclick="request_page('+(pn+1)+')">&gt;</button>';
        }
    }
    pagination_controls.innerHTML = paginationCtrls;
}
</script>

</head>

<body>

<div id="wrapper">
           .
           .
           .
</div>


<script src="./js/jquery.js"></script>
<script src="http://cdn.jquerytools.org/1.2.7/full/jquery.tools.min.js"></script>
<!-- bxSlider Javascript file -->
<script src="./js/bxslider/jquery.bxslider.min.js"></script>
<!-- bxSlider CSS file -->
<link href="./js/bxslider/jquery.bxslider.css" rel="stylesheet" />

<script src="./flowplayer/flowplayer-3.2.12.min.js"></script>

<script src="./js/comportement.js"></script>

<script> request_page(1); </script> 
</body>

</html>

和pagination_parser.php(我在developphp.com上找到的)

<?php
// Make the script run only if there is a page number posted to this script
if(isset($_POST['pn'])){
    $rpp = preg_replace('#[^0-9]#', '', $_POST['rpp']);
    $last = preg_replace('#[^0-9]#', '', $_POST['last']);
    $pn = preg_replace('#[^0-9]#', '', $_POST['pn']);
    // This makes sure the page number isn't below 1, or more than our $last page
    if ($pn < 1) { 
        $pn = 1; 
    } else if ($pn > $last) { 
        $pn = $last; 
    }
    // Connect to our database here
    include_once("bdd.php");
    $connexion->exec("SET CHARACTER SET utf8");
    // This sets the range of rows to query for the chosen $pn
    $limit = 'LIMIT ' .($pn - 1) * $rpp .',' .$rpp;
    // This is your query again, it is for grabbing just one page worth of rows by applying $limit
    $sql = "SELECT * FROM video ORDER BY id_video DESC $limit";
    $res = $connexion->query($sql);
    //$query = mysqli_query($db_conx, $sql);
    $dataString = '';

    while($row = $res->fetch(PDO::FETCH_ASSOC))//mysqli_fetch_array($query, MYSQLI_ASSOC)){
    {
        $titre=$row['titre'];
        $description=$row['description'];
        $src=$row['source_video'];
        //$itemdate = strftime("%b %d, %Y", strtotime($row["datemade"]));
        $dataString .= $titre.'|'.$src.'|'.$description.'||';
    }
    // Close your database connection
    //mysqli_close($db_conx);
    // Echo the results back to Ajax
    echo $dataString;
    exit();
}
?>

最佳答案

尝试注释掉并执行你的脚本，我认为它的 jQuery 与它冲突。

关于ajax分页和flowplayer插件之间的javascript冲突，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20803083/

26 4 0
文章推荐： css - 如何将SASS文件和CSS文件纳入版本库和开发周期
文章推荐： javascript - getitem 本地存储不工作
文章推荐： javascript - 验证按钮后提交表单必须点击两次
文章推荐： html - 如何在流体布局中固定高度？
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com