<html>
<head>
<script src="//code.jquery.com/jquery-2.1.1.min.js"></script>
<meta charset="utf-8">
<title></title>
</head>
<body>
<br><br><br>
<input id="movie" type="text" /><button>Search</button>
<div id="posterimage"></div>
<div id="poster"></div>
<div id="actors"></div>
<div id="website"></div>
</body>
</html>
$(function() {
var url = 'http://www.omdbapi.com/',
mode = '?t=',
input,
movieName;
//key = '?api_key=94a2f36cd4e27626b6a7a07766a76196';
$('button').click(function() {
var input = $('#movie').val(),
movieName = encodeURI(input);
$.ajax({
//url: url + mode + key + '&query='+movieName ,
url: url + mode + movieName + '&y=&plot=short&tomatoes=true&r=json',
dataType: 'jsonp',
success: function(data) {
console.log(data);
$('#poster').html(data.Poster);
$('#actors').html(data.Actors);
$('#posterimage').html('<img src="' + data.Poster + '" />');
//$('#website').html('<a href="' + data.Website + '" />' + 'Website' + '</a>');
$('#website').html(data.Website);
}
});
});
});
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.