【发布时间】：2019-11-04 09:50:57
【问题描述】：
我有我的 HTML 网页和一个移动应用程序。
在我的移动应用程序中，我有三个按钮，开始、暂停和停止，我的网站上也有这三个按钮（在我的网站上，这三个按钮已经有了动作）。
我想要做的是，如果我点击手机上的按钮，它会点击我网页上相同的指定按钮。
我最初的计划是，从我的移动应用程序通过邮寄发送到我的网站文件中的一个 php 文件。然后从那个 php 文件向一个 JavaScript 文件发送一个简单的变量，该 JavaScript 文件将读取它是什么变量，并根据该变量执行单击我网页中相应按钮的操作。
我在网站上使用的脚本位于我的 HTML 代码中。
网站：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="css/style.css">
<script type="text/javascript" src="js/test"></script>
<title> Spelling Bee </title>
</head>
<body>
<header>
<h1> Spelling Bee </h1>
</header>
<section>
<div id="textbox">
<h2> "Word" </h2>
</div>
<div>
<p> Choose the difficulty: </p>
<select id="difficulty">
<option value="0"></option>
<option value = "1"> Easy </option>
<option value = "2"> Medium </option>
<option value = "3"> Hard </option>
</select>
<div id="timer"></div>
<button id="start"> Start! </button>
<button id="next"> Next </button>
<button id="stop"> Stop </button>
<script>
//1000 = 1 sec
var start= document.getElementById("start");
var difficulty = document.getElementById("difficulty")
var next = document.getElementById("next");
var stop = document.getElementById("stop");
var timer;
document.getElementById("timer").innerHTML = "-";
document.getElementById("start").disabled = true;
document.getElementById("next").disabled = true;
document.getElementById("stop").disabled = true;
start.addEventListener("click", functionStart);
var seconds, stop, counterStarted = false, counter;
var select_difficulty= document.getElementById('difficulty');
select_difficulty.onchange = function select_stop_time() {
var selectedValue = select_difficulty.options[select_difficulty.selectedIndex].value;
if (selectedValue == 1 ) {
document.getElementById("start").disabled = false;
stop = 10;//10
}
else if (selectedValue == 2 ) {
document.getElementById("start").disabled = false;
stop = 15;//15
}
else if (selectedValue == 3 ){
document.getElementById("start").disabled = false;
stop = 20;//20
}
else {
document.getElementById("start").disabled = true;
document.getElementById("next").disabled = true;
document.getElementById("stop").disabled = true;
stop = 0;//0
}
}
function functionStart() {
seconds = 1;
document.getElementById('difficulty').disabled = true;
document.getElementById("start").disabled = true;
document.getElementById("next").disabled = false;
document.getElementById("stop").disabled = false;
if(counterStarted === false){
counterStarted = true;
counter = setInterval(function(){
if(seconds <= stop){
document.getElementById("timer").innerHTML = seconds;
seconds++;
}
else{
seconds = 1;
}
},1000)
}
}
stop.addEventListener("click", functionStop);
function functionStop(){
document.getElementById("timer").setAttribute("disabled", "disabled");
clearInterval(counter);
counterStarted = false;
document.getElementById('difficulty').disabled = false;
document.getElementById("timer").innerHTML = "-";
document.getElementById("start").disabled = false;
document.getElementById("next").disabled = true;
document.getElementById("stop").disabled = true;
frame();
}
next.addEventListener("click", functionNext);
function functionNext(){
seconds = stop;
}
</script>
</div>
</section>
<footer>
</footer>
</body>
</html>
移动应用程序： -HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/>
<title> Spelling Bee </title>
<!-- grupo CSS -->
<link rel="stylesheet" href="css/jquery.mobile.icons-1.4.5.min.css"/>
<link rel="stylesheet" href="css/jquery.mobile.structure-1.4.5.min.css"/>
<link rel="stylesheet" href="css/theme_sb.min.css"/>
<!--grupo JavaScript-->
<script src="js/jquery-1.11.2.min.js"></script>
<script src="js/jquery.mobile-1.4.5.min.js"></script>
<script src="js/acciones.js"></script>
<script src="phonegap.js" type="text/javascript"></script>
</head>
<body>
<div data-role="page" id="principal" style="background-image: url(imagenes/honeycomb.png); text-align:center;">
<div data-role="header" data-position="fixed" data-tap-toggle="false">
<h1> Spelling Bee </h1>
</div>
<div data-role="main" class="ui-content" style="width: 30%; margin-left: 32%; margin-top: 45%;">
<div id="buttons">
<input type="button" class="ui-btn" id="button1" value="Start!">
<input type="button" class="ui-btn" id="button2" value="Next">
<input type="button" class="ui-btn" id="button3" value="Stop!">
</div>
</div>
<div data-role="footer" align="center" data-theme="a" data-position="fixed">
<h4> Spelling Bee </h4>
<img src="imagenes/bee.png" width="60">
</div>
</div>
</body>
</html>
-JavaScript
// JavaScript Document
$(document).ready(function(e) {
$('#button1').on('click',function(){
alert("1");
});//1
$('#button2').on('click',function(){
alert("2");
});//2
$('#button3').on('click',function(){
alert("3");
});//3
}); //ready
我设置了警报来测试它。
【问题讨论】：
-
很好的描述，但我们确实需要代码才能提供帮助。请提供您的脚本（也告诉我们脚本名称 - 例如“myscript1.js”）并提供您的 HTML
-
我已经添加了我的代码，如果它太长，请原谅我，这是我第一次在这里发布。感谢您对我的问题的通知。
-
你的javascript文件是测试吗？？
-
我的应用程序的 JavaScript，是的，它只是一个测试，我的网站脚本在我的 HTML 代码中。
-
对于我的应用程序，Java 脚本文件名为“acciones.js”
标签： javascript php html