jquery .load() 与动态 js 的问题
problem with jquery .load() with dynamic js
我对 jquery 的 .load() 有疑问,
我需要在 div 中加载一个页面,该页面通过 javascript 动态加载其数据,特别是我的 html 页面通过函数中的 js 使用 [=] 的 .load 26=]:
myClickAnimElement("#ese_div_book", function() {
if (_lese_Stop) { return; }
myStopAudio();
$('#contenitore_libro').load('../librohtml/containerLibro.php?lis=AB #containerlibro');
});
让我加载到DIV的只是html元素,但我需要的是它还加载了动态到达containerlibro.php页面的js:
<!doctype html>
<html lang="it">
<head>
<!--META-->
<meta charset="utf-8">
<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--Link-->
<link rel="shortcut icon" href="../librohtml/assets/css/bootstrap.css" />
<link rel="stylesheet" href="../librohtml/assets/css/bootstrap.css">
<link rel="stylesheet" href="../librohtml/assets/css/nav_bar.css">
<link rel="shortcut icon" href="../librohtml/AB/css/menuAB.css" />
<link rel="stylesheet" href="../librohtml/AB/css/libroAB.css">
<link rel="stylesheet" href="../librohtml/assets/css/navAB.css">
<link rel="stylesheet" href="../librohtml/assets/images/nextAB.svg">
<link rel="stylesheet" href="../librohtml/assets/images/prevAB.svg">
</head>
<body>
<!--<div class="scrollbox">-->
<div id="containerlibro">
<div class="barra_enter">
<div class="dropdown">
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<div class="link-list-wrapper">
<li>
<a class="list-item" href="#">
<p class="pubblicazione"></p>
<div class="prev" onClick="indietro()"><img class="prev-img" src=""> </div>
<div class="bottone">
<button class="indice" id="idx_button2"><span>Indice</span></button>
</div>
<div class="next" onClick="avanti()"><img class="next-img" src=""> </div>
<input type="text" name="testo" class="scrivi_cerca" id="search-in" onClick="tastiera()" placeholder="cerca nel libro…">
<button class="btn-search" id="myButton" value="Highlight multiple search terms" onClick="ricerca();"><img class="img_search" alt="foto" src="assets/images/lente2.svg"></button>
<div class="box" style="visibility: hidden;">
<button class="next-search" onClick="nextsearch()">Next-search</button>
<div class="text-area" id="text_search"></div>
</div>
<button class="exit" onClick="chiudi()">X</button>
</a>
</li>
</div>
</div>
</div>
</div>
<div id="marginSX" class="margin"></div>
<div id="genera" class="hyphenate scrollbox-content" lang="it"></div>
<div id="marginDX" class="margin"></div>
<!-- <div class="scrollbar_y"></div>-->
</div>
</body>
</html>
在我的静态页面中,#genera div 的内容是通过一个 engineV7 文件处理的,该文件加载了一个名为 sectionsAB 的整个文件,其中有真正的书,而不是 .load () 只有静态 divs 被加载但不是书结构化的,你如何使用 jquery .load () 或类似的动态加载文件?
感谢您的回复!之前是正常 div,之后,我尝试使用 iframe 但我在移动设备上加载时遇到问题,现在在桌面上加载页面正常但无法在 mobDevice 中启动!
<div id="contenitore_libro" style="position: fixed;width: 100%;height:100%;top: 0%;left: 0%;z-index: 999999999;visibility: hidden;">
<iframe id="frame" src="" style="width: 100%;height: 100%;">
</iframe>
<button id="button_book" class="ese_button ese_quiz ese_colorBT1 ese_norm" style="visibility: hidden;position: fixed;top: 95%;width: 5%;height: 5%;left: 95%;background-color: lightskyblue;">
<img id="ese_back" class="myButton" src="assets/img/menu/IndietroW.svg">
</button>
</div>
$("#ese_div_book").click(function() {
$("#contenitore_libro").css("visibility", "visible");
$("#button_book").css("visibility", "visible");
console.log("ARRIVA VALORE", _nQuest);
$("#frame").attr("src", "http://localhost/librohtml/index.html?id=" + _nQuest.Libro3 + "&tit=yes&lis=AB");
});
$("#button_book").click(function() {
$(this).css("visibility", "hidden");
$("#contenitore_libro").css("visibility", "hidden");
return false
})
现在移动智能手机上的问题已经解决,但苹果设备上没有!
<body>
<div id="ese_div_book" class="ese_button ese_quiz ese_colorBT2">
<img id="ese_book" class="myButton" src="assets/img/Bt_Book.svg">
</div>
<div id="contenitore_libro" style="position: fixed;width: 100%;height:100%;top: 0%;left: 0%;z-index: 999999999;visibility: hidden;">
<iframe id="frame" src="" style="width: 100%;height: 100%;">
</iframe>
<button id="button_book" class="ese_button ese_quiz ese_colorBT1 ese_norm" style="visibility: hidden;position: fixed;top: 95%;width: 5%;height: 5%;left: 95%;background-color: lightskyblue;">
<img id="ese_back" class="myButton" src="assets/img/menu/IndietroW.svg">
</button>
</div>
</body>
<script>
$("#ese_div_book").click(function() {
$("#contenitore_libro").css("visibility", "visible");
$("#button_book").css("visibility", "visible");
// console.log("ARRIVA VALORE", _nQuest);
$("#frame").attr("src", "../librohtml/index.html?id=" + _nQuest.Libro3 + "&tit=yes&lis=AB");
});
$("#button_book").click(function() {
$(this).css("visibility", "hidden");
$("#contenitore_libro").css("visibility", "hidden");
return false
})
</script>
有什么想法吗???
我对 jquery 的 .load() 有疑问, 我需要在 div 中加载一个页面,该页面通过 javascript 动态加载其数据,特别是我的 html 页面通过函数中的 js 使用 [=] 的 .load 26=]:
myClickAnimElement("#ese_div_book", function() {
if (_lese_Stop) { return; }
myStopAudio();
$('#contenitore_libro').load('../librohtml/containerLibro.php?lis=AB #containerlibro');
});
让我加载到DIV的只是html元素,但我需要的是它还加载了动态到达containerlibro.php页面的js:
<!doctype html>
<html lang="it">
<head>
<!--META-->
<meta charset="utf-8">
<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--Link-->
<link rel="shortcut icon" href="../librohtml/assets/css/bootstrap.css" />
<link rel="stylesheet" href="../librohtml/assets/css/bootstrap.css">
<link rel="stylesheet" href="../librohtml/assets/css/nav_bar.css">
<link rel="shortcut icon" href="../librohtml/AB/css/menuAB.css" />
<link rel="stylesheet" href="../librohtml/AB/css/libroAB.css">
<link rel="stylesheet" href="../librohtml/assets/css/navAB.css">
<link rel="stylesheet" href="../librohtml/assets/images/nextAB.svg">
<link rel="stylesheet" href="../librohtml/assets/images/prevAB.svg">
</head>
<body>
<!--<div class="scrollbox">-->
<div id="containerlibro">
<div class="barra_enter">
<div class="dropdown">
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<div class="link-list-wrapper">
<li>
<a class="list-item" href="#">
<p class="pubblicazione"></p>
<div class="prev" onClick="indietro()"><img class="prev-img" src=""> </div>
<div class="bottone">
<button class="indice" id="idx_button2"><span>Indice</span></button>
</div>
<div class="next" onClick="avanti()"><img class="next-img" src=""> </div>
<input type="text" name="testo" class="scrivi_cerca" id="search-in" onClick="tastiera()" placeholder="cerca nel libro…">
<button class="btn-search" id="myButton" value="Highlight multiple search terms" onClick="ricerca();"><img class="img_search" alt="foto" src="assets/images/lente2.svg"></button>
<div class="box" style="visibility: hidden;">
<button class="next-search" onClick="nextsearch()">Next-search</button>
<div class="text-area" id="text_search"></div>
</div>
<button class="exit" onClick="chiudi()">X</button>
</a>
</li>
</div>
</div>
</div>
</div>
<div id="marginSX" class="margin"></div>
<div id="genera" class="hyphenate scrollbox-content" lang="it"></div>
<div id="marginDX" class="margin"></div>
<!-- <div class="scrollbar_y"></div>-->
</div>
</body>
</html>
在我的静态页面中,#genera div 的内容是通过一个 engineV7 文件处理的,该文件加载了一个名为 sectionsAB 的整个文件,其中有真正的书,而不是 .load () 只有静态 divs 被加载但不是书结构化的,你如何使用 jquery .load () 或类似的动态加载文件?
感谢您的回复!之前是正常 div,之后,我尝试使用 iframe 但我在移动设备上加载时遇到问题,现在在桌面上加载页面正常但无法在 mobDevice 中启动!
<div id="contenitore_libro" style="position: fixed;width: 100%;height:100%;top: 0%;left: 0%;z-index: 999999999;visibility: hidden;">
<iframe id="frame" src="" style="width: 100%;height: 100%;">
</iframe>
<button id="button_book" class="ese_button ese_quiz ese_colorBT1 ese_norm" style="visibility: hidden;position: fixed;top: 95%;width: 5%;height: 5%;left: 95%;background-color: lightskyblue;">
<img id="ese_back" class="myButton" src="assets/img/menu/IndietroW.svg">
</button>
</div>
$("#ese_div_book").click(function() {
$("#contenitore_libro").css("visibility", "visible");
$("#button_book").css("visibility", "visible");
console.log("ARRIVA VALORE", _nQuest);
$("#frame").attr("src", "http://localhost/librohtml/index.html?id=" + _nQuest.Libro3 + "&tit=yes&lis=AB");
});
$("#button_book").click(function() {
$(this).css("visibility", "hidden");
$("#contenitore_libro").css("visibility", "hidden");
return false
})
现在移动智能手机上的问题已经解决,但苹果设备上没有!
<body>
<div id="ese_div_book" class="ese_button ese_quiz ese_colorBT2">
<img id="ese_book" class="myButton" src="assets/img/Bt_Book.svg">
</div>
<div id="contenitore_libro" style="position: fixed;width: 100%;height:100%;top: 0%;left: 0%;z-index: 999999999;visibility: hidden;">
<iframe id="frame" src="" style="width: 100%;height: 100%;">
</iframe>
<button id="button_book" class="ese_button ese_quiz ese_colorBT1 ese_norm" style="visibility: hidden;position: fixed;top: 95%;width: 5%;height: 5%;left: 95%;background-color: lightskyblue;">
<img id="ese_back" class="myButton" src="assets/img/menu/IndietroW.svg">
</button>
</div>
</body>
<script>
$("#ese_div_book").click(function() {
$("#contenitore_libro").css("visibility", "visible");
$("#button_book").css("visibility", "visible");
// console.log("ARRIVA VALORE", _nQuest);
$("#frame").attr("src", "../librohtml/index.html?id=" + _nQuest.Libro3 + "&tit=yes&lis=AB");
});
$("#button_book").click(function() {
$(this).css("visibility", "hidden");
$("#contenitore_libro").css("visibility", "hidden");
return false
})
</script>
有什么想法吗???