Question

我有以下代码在设备就绪时运行：

var app = {
    initialize: function() {
        document.addEventListener('deviceready', this.onDeviceReady.bind(this), false);
    },

    onDeviceReady: function() {
        var div = document.querySelector('.app');
        div.appendChild(document.createTextNode('Scanning...'));
        div.appendChild(document.createElement('br'));

        // scan for any BLE devices for 10 seconds
        ble.scan([], 10, app.onDeviceDiscovered);

        setTimeout(app.scanComplete, 10500);
    },

    onDeviceDiscovered: function(peripheral) {
        // print peripheral details to the the console and the UI
        var peripheralString = JSON.stringify(peripheral, null, 2);
        console.log(peripheralString);

        var div = document.querySelector('.app');
        div.appendChild(document.createTextNode('Found Device'));
        var pre = document.createElement('pre');
        pre.innerText = peripheralString;
        div.appendChild(pre);
    },

    scanComplete: function() {
        // update the UI indicating the scan is complete
        var div = document.querySelector('.app');
        div.appendChild(document.createTextNode('Scan complete.'));
    }    

};

app.initialize();

我需要做的是仅在点击按钮而不是设备就绪时才运行上面的代码。

这样的事情：

    $(document).on('click', ".letmepairBtn", function(){

var app = {
    initialize: function() {
        document.addEventListener('deviceready', this.onDeviceReady.bind(this), false);
    },
  onDeviceReady: function() {
        var div = document.querySelector('.app');
        div.appendChild(document.createTextNode('Scanning...'));
        div.appendChild(document.createElement('br'));

        // scan for any BLE devices for 10 seconds
        ble.scan([], 10, app.onDeviceDiscovered);

        setTimeout(app.scanComplete, 10500);
    },

    onDeviceDiscovered: function(peripheral) {
        // print peripheral details to the the console and the UI
        var peripheralString = JSON.stringify(peripheral, null, 2);
        console.log(peripheralString);

        var div = document.querySelector('.app');
        div.appendChild(document.createTextNode('Found Device'));
        var pre = document.createElement('pre');
        pre.innerText = peripheralString;
        div.appendChild(pre);
    },

    scanComplete: function() {
        // update the UI indicating the scan is complete
        var div = document.querySelector('.app');
        div.appendChild(document.createTextNode('Scan complete.'));
    }    

};

app.initialize();  

    });

但是当我运行我的代码时，代码无法正常工作。原因是因为我仍然将deviceReady放在点击功能中，这根本没有意义。但我正在努力弄清楚如何正确地做到这一点。

有人可以就上述建议吗？

任何帮助都将不胜感激。

提前谢谢。

修改

主要问题是这行代码（我认为）：

 document.addEventListener('deviceready', this.onDeviceReady.bind(this), false);

因为这一行，以下代码只运行在DeviceReady上：

onDeviceReady: function() {
    var div = document.querySelector('.app');
    div.appendChild(document.createTextNode('Scanning...'));
    div.appendChild(document.createElement('br'));

    // scan for any BLE devices for 10 seconds
    ble.scan([], 10, app.onDeviceDiscovered);

    setTimeout(app.scanComplete, 10500);
}

这使代码在该阶段死亡。

Answer 1

Thers不需要添加和.on来记录。您可以保持所有内容相同，只需将侦听器从侦听文档更改为侦听指定的按钮

即可

如果您使用jquery，您只需将初始化函数的事件监听器更改为：

initialize: function() {
        $(".letmepairBtn").click(this.onDeviceReady.bind(this));
}

或者你可以使用vanilla javascript实现相同的功能，只需更改eventlistener和目标：

initialize: function() {
    document.getElementsbyClassName('letmepairBtn')[0].addEventListener('click', this.onDeviceReady.bind(this), false)
}

无论哪种方式，您都可以保留与以前相同的代码，只需在最后调用app.initialize并等待按钮的单击。

Javascript：转换ondeviceReady函数来点击功能？

1 个答案: