简体   繁体   中英

how to properly call photobooth.js

I am currently trying to use photobooth.js to make a simple photobooth page. I know very little about JS and webpages, but it seemed the best solution for what I have in mind. My problem is that when I load the script (no dependencies, according to the website) and try to use it in my basic app, nothing happens, so obviously I'm not calling the script properly. To make sure the script is loaded, I added a ShowAlert() function to photobooth.js that I use in an onload="ShowAlert()" statement, which indeed triggers the alert.

So adding myPhotobooth = new Photobooth( document.getElementById( "container" ) ); to my page does not work as advertised here (or more likely I don't understand how to use that)

Would someone please explain what I am missing?

The modified photobooth_min.js source:

/**
*
* Photobooth.js version 0.7

*CUSTOM DEBUG CODE
*/
function ShowAlert() {
    alert('show this message');
}
/**
*Rest of photobooth_min.js code, unmodified.
*/

my index.html page:

<!DOCTYPE html>
<html>
<head>
<title>photobooth</title>
</head>
<body>
    <div id="example"></div>
    <script type="text/javascript" src="photobooth_min.js" onload="ShowAlert()"></script>

    <script>
        myPhotobooth = new Photobooth( document.getElementById( "example" ) ); 
    </script>
</body>
</html>

my directory structure:

目录结构

when you call external script files, you shouldn't have anything inside...

<script type="text/javascript" src="WebContent/photobooth_min.js"></script>
<script>
    var myPhotobooth = new Photobooth( document.getElementById( "example" ) ); 
</script>

the other thing is the path to the file, in this case, and assuming you have this HTML in a file called index.html the structure you are setting is:

|--- index.html
|--- WebContent (folder)
      |--- photobooth_min.js 

to start, put all in the same folder like:

|-- index.html
|-- photobooth_min.js 

and reference the script only as

<script type="text/javascript" src="photobooth_min.js"></script>

PS remember that the photobooth script will never work on IE and Safari ... the 2 most used browsers in both Windows an Mac platforms...

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM