Javascript 我的混合应用程序在检查包含字符串的li项目时不会更改页面
对于我正在进行的一个项目，我想让我的混合应用程序（phonegap）在应用程序检测到来自Arduino的蓝牙信号时切换屏幕。为此，我通过几个列表项进行代码循环，并检查li项的内容是否与“TEST123”（我给Arduino的名称）相同。如果这些页面相同，应用程序应该切换到另一个页面。我编辑了名为“cordova插件（由Don Coleman在GitHub上制作）的代码，以实现这一目标 我编写了代码，这样它就可以滚动ul中的li项，读取内容并调用connect函数（如果字符串与“TEST123”相同），但我的页面似乎没有切换 谢谢你的帮助 HTML: 当然还有我的JavaScript：Javascript 我的混合应用程序在检查包含字符串的li项目时不会更改页面,javascript,html,css,arduino,phonegap-build,Javascript,Html,Css,Arduino,Phonegap Build,对于我正在进行的一个项目，我想让我的混合应用程序（phonegap）在应用程序检测到来自Arduino的蓝牙信号时切换屏幕。为此，我通过几个列表项进行代码循环，并检查li项的内容是否与“TEST123”（我给Arduino的名称）相同。如果这些页面相同，应用程序应该切换到另一个页面。我编辑了名为“cordova插件（由Don Coleman在GitHub上制作）的代码，以实现这一目标 我编写了代码，这样它就可以滚动ul中的li项，读取内容并调用connect函数（如果字符串与“TEST123”相
'use strict';
// ASCII only
function bytesToString(buffer) {
return String.fromCharCode.apply(null, new Uint8Array(buffer));
}
// ASCII only
function stringToBytes(string) {
var array = new Uint8Array(string.length);
for (var i = 0, l = string.length; i < l; i++) {
array[i] = string.charCodeAt(i);
}
return array.buffer;
}
// this is Nordic's UART service
var bluefruit = {
serviceUUID: '6e400001-b5a3-f393-e0a9-e50e24dcca9e',
txCharacteristic: '6e400002-b5a3-f393-e0a9-e50e24dcca9e', // transmit is from the phone's perspective
rxCharacteristic: '6e400003-b5a3-f393-e0a9-e50e24dcca9e' // receive is from the phone's perspective
};
var app = {
initialize: function() {
this.bindEvents();
detailPage.hidden = true;
//ale paginas hidden behalve login
},
bindEvents: function() {
document.addEventListener('deviceready', this.onDeviceReady, false);
refreshButton.addEventListener('touchstart', this.refreshDeviceList, false);
sendButton.addEventListener('click', this.sendData, false);
disconnectButton.addEventListener('touchstart', this.disconnect, false);
deviceList.addEventListener('touchstart', this.connect, false); // assume not scrolling
},
onDeviceReady: function() {
app.refreshDeviceList();
},
refreshDeviceList: function() {
deviceList.innerHTML = ''; // empties the list
if (cordova.platformId === 'android') { // Android filtering is broken
ble.scan([], 5, app.onDiscoverDevice, app.onError);
} else {
ble.scan([bluefruit.serviceUUID], 5, app.onDiscoverDevice, app.onError);
}
},
onDiscoverDevice: function(device) {
var listItem = document.createElement('li'),
html = '<b>' + device.name + '</b><br/>' +
'RSSI: ' + device.rssi + ' | ' +
device.id;
listItem.dataset.deviceId = device.id;
listItem.innerHTML = html;
deviceList.appendChild(listItem);
},
ulScroll: function() {
var ul = document.getElementById("deviceList");
var items = ul.getElementsByTagName("li");
for (var i = 0; i < items.length; i++) {
if ((items.textContent || items.innerText) == "TEST123"){
connect: function(e) {
var deviceId = e.target.dataset.deviceId,
onConnect = function(peripheral) {
app.determineWriteType(peripheral);
// subscribe for incoming data
ble.startNotification(deviceId, bluefruit.serviceUUID, bluefruit.rxCharacteristic, app.onData, app.onError);
sendButton.dataset.deviceId = deviceId;
disconnectButton.dataset.deviceId = deviceId;
resultDiv.innerHTML = "";
app.showDetailPage();
};
ble.connect(deviceId, onConnect, app.onError);
},
}
}
}
disconnect: function(event) {
var deviceId = event.target.dataset.deviceId;
ble.disconnect(deviceId, app.showMainPage, app.onError);
},
showMainPage: function() {
document.getElementById("mainPage").className = "show";
document.getElementById("detailPage").className = "hide";
},
showDetailPage: function() {
document.getElementById("detailPage").className = "show";
document.getElementById("mainPage").className = "hide";
},
onError: function(reason) {
alert("ERROR: " + reason);
}
};
“严格使用”；
//仅限ASCII码
函数bytesToString（缓冲区）{
返回字符串.fromCharCode.apply（null，新的Uint8Array（缓冲区））；
}
//仅限ASCII码
函数stringToBytes（字符串）{
var数组=新的Uint8Array（string.length）；
for（变量i=0，l=string.length；i另外，非常抱歉代码没有组织我将如何组织代码：
var app={
devices:[], //thats were the devices are stored
onDeviceReady:refreshDeviceList,
refreshDeviceList: function() {
deviceList.innerHTML = ''; // empties the list
this.devices=[];
if (cordova.platformId === 'android') { // Android filtering is broken
ble.scan([], 5, app.onDiscoverDevice, app.onError);
} else {
ble.scan([bluefruit.serviceUUID], 5, app.onDiscoverDevice, app.onError);
}
//all devices checked, lets search ours:
var my=this.devices.find(device => { device.name=="TEST123"});
if(my){
ble.connect(my.id,app.onconnect,errorhandling);
}else{
alert("my device not found");
}
},
onDiscoverDevice: function(device) {
//add to html
var listItem = document.createElement('li'),
html = '<b>' + device.name + '</b><br/>' +
'RSSI: ' + device.rssi + ' | ' +
device.id;
listItem.innerHTML = html;
deviceList.appendChild(listItem);
//add to devices:
this.devices.push(device);
},
onconnect:function(e){
//your connect function
}
}
应该连接什么：功能（e）在函数内部执行？？这是对象语法！！我对这个比较陌生，你能解释一下你的意思吗？我猜我应该在那里调用函数并将connect:function放在functiondeviceList之外是未定义的，将函数输出写入html，然后从中解析回来对我来说没有意义。T对每一种逻辑都有抵触…整个结构毫无意义，可能从一开始就重写它，并在编写复制+粘贴代码之前学习正确的js…将函数输出写入html是我们在课堂上的想法，这对我来说也很奇怪。恶魔主义者是我从github编辑的代码中得到的东西。我看不到它做了什么，这就是nk的解决方案，以解决它我正在摆脱刷新按钮等，因为我希望开关发生时，信号被发现。我看到了重组，并为此感谢！我要检查代码是否这样工作，当我修复错误，目前在我的代码。我猜onconnect函数应该包含app.shOwtailPage（）；但这似乎不起作用。我也尝试了代码的连接部分，但这似乎也不起作用。我看到您已经使用了触发onconnect函数的ble.connect，对吗？因为如果是这样，我认为app.showtailPage（）；应该足够了。是的，确实如此。如果我认为你的新结构代码涵盖了从刷新设备列表到断开连接功能的旧代码，我是对的吗
'use strict';
// ASCII only
function bytesToString(buffer) {
return String.fromCharCode.apply(null, new Uint8Array(buffer));
}
// ASCII only
function stringToBytes(string) {
var array = new Uint8Array(string.length);
for (var i = 0, l = string.length; i < l; i++) {
array[i] = string.charCodeAt(i);
}
return array.buffer;
}
// this is Nordic's UART service
var bluefruit = {
serviceUUID: '6e400001-b5a3-f393-e0a9-e50e24dcca9e',
txCharacteristic: '6e400002-b5a3-f393-e0a9-e50e24dcca9e', // transmit is from the phone's perspective
rxCharacteristic: '6e400003-b5a3-f393-e0a9-e50e24dcca9e' // receive is from the phone's perspective
};
var app = {
initialize: function() {
this.bindEvents();
detailPage.hidden = true;
//ale paginas hidden behalve login
},
bindEvents: function() {
document.addEventListener('deviceready', this.onDeviceReady, false);
refreshButton.addEventListener('touchstart', this.refreshDeviceList, false);
sendButton.addEventListener('click', this.sendData, false);
disconnectButton.addEventListener('touchstart', this.disconnect, false);
deviceList.addEventListener('touchstart', this.connect, false); // assume not scrolling
},
onDeviceReady: function() {
app.refreshDeviceList();
},
refreshDeviceList: function() {
deviceList.innerHTML = ''; // empties the list
if (cordova.platformId === 'android') { // Android filtering is broken
ble.scan([], 5, app.onDiscoverDevice, app.onError);
} else {
ble.scan([bluefruit.serviceUUID], 5, app.onDiscoverDevice, app.onError);
}
},
onDiscoverDevice: function(device) {
var listItem = document.createElement('li'),
html = '<b>' + device.name + '</b><br/>' +
'RSSI: ' + device.rssi + ' | ' +
device.id;
listItem.dataset.deviceId = device.id;
listItem.innerHTML = html;
deviceList.appendChild(listItem);
},
ulScroll: function() {
var ul = document.getElementById("deviceList");
var items = ul.getElementsByTagName("li");
for (var i = 0; i < items.length; i++) {
if ((items.textContent || items.innerText) == "TEST123"){
connect: function(e) {
var deviceId = e.target.dataset.deviceId,
onConnect = function(peripheral) {
app.determineWriteType(peripheral);
// subscribe for incoming data
ble.startNotification(deviceId, bluefruit.serviceUUID, bluefruit.rxCharacteristic, app.onData, app.onError);
sendButton.dataset.deviceId = deviceId;
disconnectButton.dataset.deviceId = deviceId;
resultDiv.innerHTML = "";
app.showDetailPage();
};
ble.connect(deviceId, onConnect, app.onError);
},
}
}
}
disconnect: function(event) {
var deviceId = event.target.dataset.deviceId;
ble.disconnect(deviceId, app.showMainPage, app.onError);
},
showMainPage: function() {
document.getElementById("mainPage").className = "show";
document.getElementById("detailPage").className = "hide";
},
showDetailPage: function() {
document.getElementById("detailPage").className = "show";
document.getElementById("mainPage").className = "hide";
},
onError: function(reason) {
alert("ERROR: " + reason);
}
};
var app={
devices:[], //thats were the devices are stored
onDeviceReady:refreshDeviceList,
refreshDeviceList: function() {
deviceList.innerHTML = ''; // empties the list
this.devices=[];
if (cordova.platformId === 'android') { // Android filtering is broken
ble.scan([], 5, app.onDiscoverDevice, app.onError);
} else {
ble.scan([bluefruit.serviceUUID], 5, app.onDiscoverDevice, app.onError);
}
//all devices checked, lets search ours:
var my=this.devices.find(device => { device.name=="TEST123"});
if(my){
ble.connect(my.id,app.onconnect,errorhandling);
}else{
alert("my device not found");
}
},
onDiscoverDevice: function(device) {
//add to html
var listItem = document.createElement('li'),
html = '<b>' + device.name + '</b><br/>' +
'RSSI: ' + device.rssi + ' | ' +
device.id;
listItem.innerHTML = html;
deviceList.appendChild(listItem);
//add to devices:
this.devices.push(device);
},
onconnect:function(e){
//your connect function
}
}
refreshButton etc are undefined. You need to find them:
var refreshButton=document.getElementById("refreshButton");