index.html has a hyperlink that clicks to about.html and has simply configured the route. The
about.html page has some js code.
the js code that is clicked from index.html to about.html,about.html cannot be executed. If you directly open the about.html page, js can be executed, what is the principle of this?
similarly, it is not possible to write css styles directly or refer to external styles on about.html pages.
index.html code snippet
<div id="app">
<div class="statusbar"></div>
<div class="view view-main">
<div class="page">
<div class="page-content">
Page content goes here
<a href="/about/">About app</a>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="f7/js/min.js"></script>
<script type="text/javascript" src="f7/js/app.js"></script>about.html code snippet
<div id="app">
<div class="statusbar"></div>
<div class="view view-main">
<div class="page">
<div class="page-content">
<a href="-sharp" class="button button-raised open-toast-center">Toast on Center</a>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="f7/js/min.js"></script>
<script type="text/javascript" src="f7/js/app.js"></script>
<script>
var toastCenter = app.toast.create({
text: "I\"m on center",
position: "center",
closeTimeout: 2000,
});
$$(".open-toast-center").on("click", function () {
toastCenter.open();
});
</script>
</body>
</html> I saw some answers on the public network, and some said they wanted to use page callback, but the version of framework7 (v3.6.5) I used didn"t seem to have the function of page callback.
try
$(document) .on ("page:init"," .page [data-name= "about"]", function (e) {
console.log("2");})
app.onPageInit ("about", function () {
)console.log("2");});
has no effect.