1

所以,我是 javascript 的新手。我的代码如下,它基于一个带有画布和几个边框的 xaml 文件:

var defaultPage = null;
var aantalKliks;
var correcteBorders;
var incorrecteBorders;
var geenAntwBorders;

function onLoaded() {
    defaultPage = document.getElementById('DefaultPage');
    alert('In onloaded van Default.xaml.');
    aantalKliks = 0;
    aantalBorderKliks = 0;

    correcteBorders = new Array();
    for (var i = 0; i < 3; i++) {
        correcteBorders[i] = defaultPage.content.findName('CorrecteBorder' + i);
    }
    incorrecteBorders = new Array();
    for (var i = 0; i < 3; i++) {
        incorrecteBorders[i] = defaultPage.content.findName('IncorrecteBorder' + i);
    }
    geenAntwBorders = new Array();
    for (var i = 0; i < 3; i++) {
        geenAntwBorders[i] = defaultPage.content.findName('GeenAntwBorder' + i);
    }

}

function OnCanvasClicked() {
    if (aantalKliks == 2) {
        aantalKliks = 0;
    }
    if (aantalKliks == 0) {
        for (var i = 0; i < correcteBorders.length; i++) {
            correcteBorders[i].Visibility = 'Visible';
        }

        for (var i = 0; i < incorrecteBorders.length; i++) {
            incorrecteBorders[i].Visibility = 'Visible';
        }

        for (var i = 0; i < geenAntwBorders.length; i++) {
            geenAntwBorders[i].Visibility = 'Visible';
        }

    } else if (aantalKliks == 1) {
        for (var i = 0; i < correcteBorders.length; i++) {
            correcteBorders[i].Visibility = 'Collapsed';
        }

        for (var i = 0; i < incorrecteBorders.length; i++) {
            incorrecteBorders[i].Visibility = 'Collapsed';
        }

        for (var i = 0; i < geenAntwBorders.length; i++) {
            geenAntwBorders[i].Visibility = 'Collapsed';
        }
        aantalKliks++;
    }



    function borderClicked(sender) {

        for (var i = 0; i < correcteBorders.length; i++) {
            correcteBorders[i].Visibility = 'Collapsed';
        }

        for (var i = 0; i < incorrecteBorders.length; i++) {
            incorrecteBorders[i].Visibility = 'Collapsed';
        }

        for (var i = 0; i < geenAntwBorders.length; i++) {
            geenAntwBorders[i].Visibility = 'Collapsed';
        }
        sender['Visibility'] = 'Visible';
    }

当我单击画布中的任意位置并使所有边框消失/重新出现时,会触发 OnCanvasClicked 函数。当我单击特定边框时会触发函数borderClicked。当我单击特定边框时,会触发函数borderClicked,但是之后也会立即执行 OnCanvasClicked 函数,这会导致不需要的结果。我认为如果单击边框,我需要一些方法来忽略 OnCanvasClicked 函数,我确实谷歌了这个但老实说,我并没有真正理解它们在大多数解决方案中的含义,所以我希望有人能以简单的方式向我解释我需要做什么(以及我在做什么)。

4

3 回答 3

4

当borderClicked函数被触发时,你需要设置event.stopPropagation()

于 2013-04-26T13:12:12.670 回答
0

试试这个,这将阻止 Javascript 进一步执行

event.preventDefault()
于 2013-04-26T13:29:23.527 回答
0

@Harshit 是正确的

当borderClicked函数被触发时,你需要设置event.stopPropagation()

我只是想添加这个链接/示例,我发现它对理解冒泡非常有用

http://samples.msdn.microsoft.com/workshop/samples/author/dhtml/refs/ie9_event_phases.htm

于 2013-04-26T13:35:15.930 回答