このjqueryコードは、jsonデータをspan html入力要素内に表示しています。しかし、映画ジャンルの配列オブジェクトを表示するためにforループを実装することに失敗しました。json API経由の簡単なループ
は、今のところは、アレイのちょうど0インデックスだが、私はすべてを表示したい。..
$("#txt-movie-genres").val(json.genres[0].name)
$(document).ready(function() {
var url = 'http://api.themoviedb.org/3/',
mode = 'movie/',
movie_id,
key = '?api_key=e9dfeccf734a61b9a52d9d7660f0d0a1';
$('button').click(function() {
var input = $('#movie').val(),
movie_id = encodeURI(input);
$.ajax({
type: 'GET',
url: url + mode + movie_id + key,
async: false,
jsonpCallback: 'testing',
contentType: 'application/json',
dataType: 'jsonp',
success: function(json) {
// grab the span elements by ID and replace their text with the json text
// $("#movie-title").text(json.title);
$("#txt-movie-title").val(json.title)
$("#txt-movie-genres").val(json.genres[0].name)
console.dir(json);
},
error: function(e) {
console.log(e.message);
}
});
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="movie" type="text" /><button>Search</button>
<h1>Movie info:</h1>
<p>Movie title: <span id="span-movie-title"></span> </p>
<div class="input-group">
<input id="txt-movie-title" name="title" type="text" />
<div class="input-group-addon">
Movie Name
</div>
</div>
<div class="input-group">
<input id="txt-movie-genres" name="genres" type="text" />
<div class="input-group-addon">
Movie Genre
</div>
</div>
単一の入力で名前を区切っていますか? – Alexander
はい!それは "アクション、アドベンチャー、ホラー"などとなることができます。 –