スライダーの値を Python スクリプトに渡す jQuery Mobile スライダーを使用して Web ページを設定しようとしています。最終的な目標は、このスライダーを使用して、Arduino に接続されたモーターを実行する Web サイトを介して Python スクリプトを制御することです。スライダーはモーターの速度を制御する必要があります。
Javascript および JQuery Mobile UI から Python CGI スクリプトを実行する のコードを適応させていますが、実際に動作させることはできません。
これが私のindex.htmlです
<!DOCTYPE html>
<html>
<head>
<title>Slider Test</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.css" />
<script src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.js"> </script>
<script>
$(document).ready(function() {
$('.posting-slider').on('slidestop', function(e) {
$.post('cgi-bin/script.py', { id: $(this).data('slider-id'), value: e.target.value }, function(data, textStatus, jqXHR) {
console.log('POSTed: ' + textStatus);
});
});
});
</script>
</head>
<body>
<div data-role="page">
<div data-role="fieldcontain">
<fieldset data-role="controlgroup">
<div class="rgbw_label">
<label for="red_slider">
Slider 1:
</label>
</div>
<input type="range" id="slider1" name="slider1" class="posting-slider" data-slider-id="1" value="0" min="0" max="100" data-highlight="true" />
</fieldset>
</div>
<div data-role="footer">
<h4>Page Footer</h4>
</div>
</div>
そして、これが私のscript.pyです(cgi-binフォルダーにあります)。
#!/usr/bin/env python
import cgi
form=cgi.FieldStorage()
import json
#Real code I will be running, haven't tested it yet
#import serial
#ser = serial.Serial('dev/ttyACM0', 9600)
#ser.write("%s\n" % (form["value"]))
#ser.close()
#Testing code
file=open('test.txt', "w")
file.write("HELLO")
file.close()
print "Content-type: application/json"
print
print(json.JSONEncoder().encode({"status":"ok"}))
私はapache2サーバーを備えたラズベリーパイで実行しています。
Web ページは、期待どおりにスライダーで読み込まれます。また、localhost/cgi-bin/script.py に移動すると、スクリプトが実行され、test.txt ファイルが生成されます。
問題は JavaScript にあるようです。script.py ファイルの実行をトリガーしておらず、値が正しく渡されているかどうかもわかりません。
誰でも問題を確認できますか? ありがとう!