なぜ送信ボタンが結果を出力しないのですか?コードに何が間違っているのか分からないようです。基本的にはMashapeのBMI API(https://market.mashape.com/nviror/bmi-calculator)ですが、動作させることができません。私は、この問題を解決することはできませんので ... JavaScriptとAPI年代に新しいです。ここJavaScriptとHTMLのフォームの一部です:APIが正しく動作しないのはなぜですか?
注:
// TODO: Use a function closure and release global $
$.noConflict();
(function($){
$(document).ready(function() {
$('#bmi-form').on('submit', function(event) {
//saving inputs
var weight = $('#bmi-weight').val();
var height = $('#bmi-height').val();
$.get(
'https://bmi.p.mashape.com/WyFUMDOkdrmshARoxfXDWLZmMeccp180tJEjsnCz3MCFuXJdEo' + weight + height,
function(data,json){
$('#bmi').append(
'<p>Your BMI is: '+data.bmi.value+'</p>'
);
$('#bmi').append(
'<p>Your status is: '+data.bmi.status+'</p>'
);
$('#bmi').append(
'<p>Your risk is: '+data.bmi.risk+'</p>'
);
});
var string= 'Your Bmi: ' +value+ '. Your status:' +status+ '. Your risk:' +risk + '.';
$('#results').text(string);
});
event.preventDefault();
});
});(jQuery);
<section id="bmi">
<form id="bmi-form" name="bmi-form" method="get" action="#null">
<label for="bmi-weight">Type in your weight:</label>
<input type="text" id="bmi-weight" name="bmi-weight" />
<label for="bmi-height">Type in your height:</label>
<input type="text" id="bmi-height" type="text" name="bmi-height" />
<input type="submit" id="bmi-submit" name="bmi-submit" value="Check BMI" />
</form>
<p id="results"></p>
</section>
GETリクエストを使用している間、あなたがリンクしているAPIはPOST要求を使用しています。また、ペイロードデータをJSON –
@OscarSiauwとして構築する必要があります。私が選択したAPIが意図したとおりに動作せず、GETリクエストを使用するAPIを見つけられるはずです。または私は間違って何かをしています... –
APIは正しいですが、代わりにPOSTリクエストを使用する必要があります。 JSONとしてペイロードを構築します。 APIドキュメントの例: {"weight":{"value": "85.00"、 "unit": "kg"}、 "height":{"value": "170.00"、 "unit" "cm"}、 "sex": "m"、 "age": "24"、 "waist": "34.00"、 "hip": "40.00"} –