本文介绍了你如何在Javascript代码中获得appBar参考的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

根据主题
http://social.msdn.microsoft.com/Forums/en-US/winappswithhtml5/thread/e55eff4b-8896-4bce-a64f-0acd27408dd4

我使用以下代码创建了应用栏:
$

I have created the app bar using following code:

appBar1:

<!DOCTYPE html>
<html>
    <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title></title>
    </head>
    <body>
        <div id="appBar" data-win-control="WinJS.UI.AppBar">
<button data-win-control="WinJS.UI.AppBarCommand"
data-win-options="{section: 'global', label: 'New Item', icon: 'add'}">
</button>
<button data-win-control="WinJS.UI.AppBarCommand"
data-win-options="{section: 'global', label: 'Stores',
icon: 'shop'}">
</button>
</div>
    </body>
</html>

在其他页面中:

<!-- import HTML fragments -->
<div data-win-control="WinJS.UI.HtmlControl"
data-win-options="{uri: '/html/appBar1.html'}"></div>
<!-- end of HTML fragments -->
<!-- template>

现在问题是,

1。你如何在Javascript代码中获得appBar参考?我尝试了document.getElementById(" appBar")。winControl,但它不起作用。

1. How do you get the appBar reference in Javascript code? I tried document.getElementById("appBar").winControl, but it does not work.

2。如何在appbar命令上安装事件处理程序?我无法在我的javascript代码中获取按钮引用。

2. How do you install the event handlers on appbar commands here? I can not get the button reference in my javascript code.




推荐答案

var appBar = document.querySelector("#appbar")。winControl;

appBar.getCommandById(" shop")。onclick = function(){
// do something};

var appBar = document.querySelector("#appbar").winControl;appBar.getCommandById("shop").onclick = function() {//do something};

你需要在data-win-options中给每个命令一个id,就是你引用它的方式。

You need to give each command an id in the data-win-options, that is how you reference it.

data-win-options =" {section:'global' ,label:'Stores',图标:'shop',id:'shop'}"

data-win-options="{section: 'global', label: 'Stores', icon: 'shop', id: 'shop'}"


这篇关于你如何在Javascript代码中获得appBar参考的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

10-20 02:19