admin管理员组

文章数量:1289830

I create an application with framework7. Now I try to execute a javascript in my page-content, but it doesn't execute.

<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>

How can I run this javascript code ?

UPDATE

The page is loaded from an other HTML-Page.

I create an application with framework7. Now I try to execute a javascript in my page-content, but it doesn't execute.

<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>

How can I run this javascript code ?

UPDATE

The page is loaded from an other HTML-Page.

Share Improve this question edited May 4, 2016 at 13:38 michael-mammut asked May 4, 2016 at 13:08 michael-mammutmichael-mammut 2,7835 gold badges31 silver badges49 bronze badges
Add a ment  | 

4 Answers 4

Reset to default 5

Use Callbacks (onPageInit) to execute code

I had never heard of Framework7 before this, but after taking a look at the docs, I don't believe you are going to be able to use Javascript this way.

It would appear that for JS events, you have to scope the event inside a Framework7 constructor:

var myApp = new Framework7();

var $$ = Dom7;

$$('.alert-text').on('click', function () {
    myApp.alert('Here goes alert text');
});

Of course the above example is taken directly from the F7 documentation, and is dependent on a click event, but you may be able to try out the alert event as a method of myApp and see if that works for you.

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 remended)
$$(document).on('page:init', '.page[data-page="dashboard"]', function (e) {
    console.log('dashboard loaded with page:init');
    createGraph();
});

Above worked me well.. although following didnt work.

myApp.onPageInit('dashboard', function (page) {
    console.log('dashboard page initialized');
    console.log(page);
});

If you written any javascript code inside index.html file, Put that code in

    <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>

本文标签: javascriptHow to use JS in Framework7Stack Overflow