如何通过套接字在两个不同页面上单击具有相同值的两个按钮?

时间:2019-03-10 12:25:26

标签: javascript python-3.x websocket client-server

我有一个客户端文件(是HTML文件)和服务器文件(是python文件)。

我在客户端文件上有两个按钮。当我打开客户端文件的两个窗口时,它们由服务器连接在一起。

现在,当我在一个窗口中单击客户端上的值为1的按钮时,应该在另一窗口中自动单击具有相同值的相同按钮。

当一个按钮被单击时,如何验证两个窗口上的按钮是否被单击

我知道我必须使用代码中没有的套接字。

有人可以建议我如何实现这一目标吗?

客户端页面从另一个我不包含的HTML页面中获取按钮值。

我想知道我应该使用哪个概念?

pass.html

<!DOCTYPE html>
<html lang="en">
<head>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.4.8/socket.io.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
    <meta charset="UTF-8">
    <title>Pass</title>
     <style>.tictac{
width:200px;
height:200px;
padding: 5px;
font-weight: bold;
cursor: pointer;
border-radius: 5px;
border: 1px solid #D9D9D9;
font-size: 200%;
}
</style>
</head>
<body>
<center>

    <br><br>

    <form>
      <input type="button" id="sq1" name="sqrone" class="tictac"  value = {{sqrone}} onclick="onClickHandler(this)" onClick="sendMsg()"/>
      <input type="button" id="sq2" name="sqrtwo" class="tictac"  value = {{sqrtwo}} onclick="onClickHandler(this)" onClick="sendMsg()"/>
</form>



</center>

<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.7.3/socket.io.min.js"></script>




<script type="text/javascript">
function onClickHandler(elem) {
elem.style.background = 'red';
elem.style.color = 'black';
}
</script>



</body>
</html>

app.py

from flask import Flask, render_template, request
from flask_socketio import SocketIO
app = Flask(__name__)

app.config['SECRET_KEY'] = 'mysecret'
socketio = SocketIO(app)
@app.route('/')

def index():
    return render_template('index.html')

@app.route('/', methods=['POST'])

def getvalue():
      sqrone =  request.form['sqrone']
      sqrtwo = request.form['sqrtwo']
      return render_template('pass.html', sqrone=sqrone, sqrtwo=sqrtwo)

def contact():
    if request.form.get('sqrone') == '1':
        pass #button click function in python
    elif request.form.get('sqrtwo') == '2':
        pass #button click function in python
    return render_template('pass.html', )



if __name__ == '__main__':

    app.run(debug=True)

0 个答案:

没有答案