文章/答案/技术大牛

发布

问Kik站点上未启用Kik
EN

Stack Overflow用户

提问于 2015-02-18 02:32:23

回答 2查看 482关注 0票数 1

我最近想测试一下kik网站的开发。我分叉并克隆了kik的starter-kit repository。我按照设置编写了这个简单的脚本(该脚本在没有if语句的情况下运行得很好)：

if (kik.enabled) {
    var div = document.getElementById("main_button");
    div.innerHTML = "KIK IS ENABLED!"
}

这应该会将网页上主按钮的文本更改为"KIK is ENABLED!“如果站点是通过kik应用程序运行的。我在本地网络上使用以下命令启动调试服务器

npm start

我在手机上启动kik，转到浏览器并连接到服务器。它连接得很好，网页显示出来，唯一的问题是按钮的文本没有改变，这表明即使我通过kik应用程序运行了kik也没有启用kik。

我不知道这是什么原因。网站是否需要在在线kik服务器上运行才能启用kik？

以下是应该相关的代码：

index.html

<!DOCTYPE html>
<html manifest="manifest.appcache">
    <head>
        <!-- App info -->
        <title>Starter Kit</title>
        <meta charset="utf-8">
        <meta name="description" content="My amazing app!">
        <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
        <meta name="kik-transparent-statusbar" content="black">
        <meta name="kik-hide-form-helpers" content="true">
        <link rel="kik-icon" href="/img/icon.png">

        <!-- Styles -->
        <link rel="stylesheet" href="//cdn.kik.com/app/3.0.1/app.min.css">
        <link rel="stylesheet" href="/css/styles.css">
        <link rel="stylesheet" href="/css/home.css">
        <link rel="stylesheet" href="/css/page2.css">
    </head>

    <body>
        <!-- Pages -->

        <div class="app-page home-page" data-page="home">
            <div class="app-topbar red">
                <div class="app-title">Home page</div>
            </div>
            <div class="app-content">
                <div class="app-section">
                    <div id="main_button" class="app-button" data-target="page2">Go to Page 2</div>
                </div>
            </div>
        </div>

        <div class="app-page page2-page" data-page="page2">
            <div class="app-topbar red">
                <div class="app-button left" data-back data-autotitle></div>
                <div class="app-title">Page 2</div>
            </div>
            <div class="app-content">
                Page 2 is lonely
            </div>
        </div>

        <!-- Scripts -->
        <script src="/zerver/API.js"></script>
        <script src="//cdnjs.cloudflare.com/ajax/libs/zepto/1.1.3/zepto.min.js"></script>
        <script src="//cdn.kik.com/kik/1.0.22/kik.js"></script>
        <script src="//cdn.kik.com/app/3.0.1/app.min.js"></script>
        <script src="/controller/home.js"></script>
        <script src="/controller/page2.js"></script>
        <script src="/main.js"></script>
    </body>
</html>

home.js

if (kik.enabled) {
    var div = document.getElementById("main_button");
    div.innerHTML = "KIK IS ENABLED!"
}

kik

回答 2

Stack Overflow用户

发布于 2015-04-13 21:27:21

这个：document.getElementById("main_button")

应该是：page.querySelector("#main_button")

App.js在创建供用户导航到的新页面时，将文档中的超文本标记语言页面用作模板。home.js中的控制器被认为是设置和运行页面的一种自给自足的方式。

因此，需要执行的查询是：page.querySelector("#main_button")。这是因为page元素可能还没有附加到DOM，所以document.querySelector无法找到它。

票数 1

Stack Overflow用户

发布于 2015-03-08 23:18:24

这仍然是一个问题吗？

我不知道home.js是否在做其他事情，但我建议尝试将它放在一些现成的闭包中。JQuery的$(function(){})或kik.ready

示例：

home.js

kik.ready(function() {

    if (kik.enabled) {
        var div = document.getElementById("main_button");
        div.innerHTML = "KIK IS ENABLED!"
    }

}

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/28568597

复制

相似问题

问Kik站点上未启用Kik
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Kik站点上未启用KikEN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Kik站点上未启用Kik
EN