单击特定容器中的运行功能

时间:2013-07-31 18:39:19

标签: javascript

我有两个问题:

首先我该如何更改此功能,以便在用户点击ID为“canvascontent”的div时触发该功能:

Event.add(window, "load", function() {

更重要的是,如何定义下面按钮的功能仅在首先触发上述功能时触发?

<input type="button" onclick="sketch.toDataURL()" style="" value="Speichern">

谢谢!

2 个答案:

答案 0 :(得分:1)

Event.Add不是一件事,而是Event object is

//Set a variable so both functions have scope to it.
var canvasClicked = false;

//Add the 'click' event to the DOM element "canvascontent"
//You could also use .addEventListener()
document.getElementById("canvascontent").onclick = function(e) {
    //do whatever
    canvasClicked = true;
};

//Call sketch data when the button is clicked
function sketchData() {
    //only sketch to the DataURL if the canvas has been clicked.
    if (canvasClicked) {
        sketch.toDataURL()
    }
}

然后......

<input type="button" onclick="sketchData()" style="" value="Speichern">

答案 1 :(得分:0)

以下是您想要做的完整示例:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    <script type="text/javascript"> 

        var buttonClicked = false;
        function load()
        {
            //Adds the event handler dynamicly. Could also be written in html like so:
            // <div id="canvascontent" onclick="divClick()">
            var div = document.getElementById("canvascontent");
            div.setAttribute('onclick', 'divClick()')
        }

        function buttonClick()
        {
            if (buttonClicked == true)
            {
                alert("DONE");
                sketch.toDataURL();
            }
        }

        function divClick()
        {
            buttonClicked = true;
        }
    </script>
</head>
<body onload="load()">
    <div id="canvascontent">
        Content of div
    </div>
    <input type="button" onclick="buttonClick()" style="" value="Speichern">
</body>
</html>