如何在Framework7中使用JS?
How to use JS in Framework7?
我使用 framework7 创建了一个应用程序。现在我尝试在我的 page-content
中执行 javascript
,但它没有执行。
<div class="pages">
<div class="page close-panel" data-page="item">
<div class="page-content">
<div class="content-block-title">Title</div>
<script type="text/javascript">
alert("testoutput"); // no alert
console.log("TEST"); // no log
</script>
</div>
</div>
我如何 运行 这个 javascript 代码?
更新
该页面是从另一个 HTML 页面加载的。
如果您在 index.html 文件中编写了任何 javascript 代码,请将该代码放入
<head>
<script>
alert("testoutput"); // no alert
console.log("TEST"); // no log
</script>
</head> like this, which is defined in index.html file
Or ,if you want write JS code for some particular html file ,
Do like this
<div class="page close-panel" data-page="item">
<div class="page-content">
<div class="content-block-title">Title</div>
</div>
<script>
alert("testoutput"); // no alert
console.log("TEST"); // no log
</script>
</div>
在此之前我从未听说过 Framework7,但是在查看了文档之后,我不相信您将能够以这种方式使用 Javascript。
看来对于 JS 事件,您必须在 Framework7 构造函数中限定事件范围:
var myApp = new Framework7();
var $$ = Dom7;
$$('.alert-text').on('click', function () {
myApp.alert('Here goes alert text');
});
当然上面的例子直接取自 F7 文档,并且依赖于点击事件,但你可以尝试将警报事件作为 myApp
的方法,看看是否适合你。
使用回调(onPageInit)执行代码
var myApp = new Framework7();
//Add callback function that will be executed when Page with data-page="about" attribute will be initialized
myApp.onPageInit('dashboard', function (page) {
console.log('dashboard page initialized');
console.log(page);
});
// Option 2. Using live 'page:init' event handlers for each page (not recommended)
$$(document).on('page:init', '.page[data-page="dashboard"]', function (e) {
console.log('dashboard loaded with page:init');
createGraph();
});
上面对我很有效..虽然下面没有用。
myApp.onPageInit('dashboard', function (page) {
console.log('dashboard page initialized');
console.log(page);
});
我使用 framework7 创建了一个应用程序。现在我尝试在我的 page-content
中执行 javascript
,但它没有执行。
<div class="pages">
<div class="page close-panel" data-page="item">
<div class="page-content">
<div class="content-block-title">Title</div>
<script type="text/javascript">
alert("testoutput"); // no alert
console.log("TEST"); // no log
</script>
</div>
</div>
我如何 运行 这个 javascript 代码?
更新
该页面是从另一个 HTML 页面加载的。
如果您在 index.html 文件中编写了任何 javascript 代码,请将该代码放入
<head>
<script>
alert("testoutput"); // no alert
console.log("TEST"); // no log
</script>
</head> like this, which is defined in index.html file
Or ,if you want write JS code for some particular html file ,
Do like this
<div class="page close-panel" data-page="item">
<div class="page-content">
<div class="content-block-title">Title</div>
</div>
<script>
alert("testoutput"); // no alert
console.log("TEST"); // no log
</script>
</div>
在此之前我从未听说过 Framework7,但是在查看了文档之后,我不相信您将能够以这种方式使用 Javascript。
看来对于 JS 事件,您必须在 Framework7 构造函数中限定事件范围:
var myApp = new Framework7();
var $$ = Dom7;
$$('.alert-text').on('click', function () {
myApp.alert('Here goes alert text');
});
当然上面的例子直接取自 F7 文档,并且依赖于点击事件,但你可以尝试将警报事件作为 myApp
的方法,看看是否适合你。
使用回调(onPageInit)执行代码
var myApp = new Framework7();
//Add callback function that will be executed when Page with data-page="about" attribute will be initialized
myApp.onPageInit('dashboard', function (page) {
console.log('dashboard page initialized');
console.log(page);
});
// Option 2. Using live 'page:init' event handlers for each page (not recommended)
$$(document).on('page:init', '.page[data-page="dashboard"]', function (e) {
console.log('dashboard loaded with page:init');
createGraph();
});
上面对我很有效..虽然下面没有用。
myApp.onPageInit('dashboard', function (page) {
console.log('dashboard page initialized');
console.log(page);
});