Javascript 我想调用一个函数,该函数需要通过使用JQuery单击链接来获取参数
我是JQuery的新手,如果这是一个垃圾场,我很抱歉 我有这个网站(在我的电脑上) 我使用以下代码创建:Javascript 我想调用一个函数,该函数需要通过使用JQuery单击链接来获取参数,javascript,jquery,html,Javascript,Jquery,Html,我是JQuery的新手,如果这是一个垃圾场,我很抱歉 我有这个网站(在我的电脑上) 我使用以下代码创建: <!DOCTYPE html> <html> <head> <title>Video Finder</title> </head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquer
<!DOCTYPE html>
<html>
<head>
<title>Video Finder</title>
</head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"> </script>
<script>
$(document).ready(function(){
$('form').submit(function(e){
e.preventDefault();
})
$('#submitform').click(function(){
var action = $(this).parent().attr('action');
action += '&query=' + $(this).parent().find('input[name="query"]').val() + '&language=es' ;
//window.location.href = action;
$("#PageSelector td").parent().remove();
$("#userdata td").parent().remove();
$.getJSON(action, function(data) {
var myNext = action + "&page=" + parseInt(parseInt(data.page) + 1) //https://api.themoviedb.org/3/search/movie?api_key=1ca8226c006afb25adc4c816a2f8c184&query=black&language=es&page=2 (Next Page)
var myPrev = action + "&page=" + parseInt(parseInt(data.page) - 1) //https://api.themoviedb.org/3/search/movie?api_key=1ca8226c006afb25adc4c816a2f8c184&query=black&language=es&page=0 (Previous page)
var myNextLink
var myPrevLink
if (parseInt(data.page) >= parseInt(data.total_pages)) {
myNextLink = "___"
} else {
myNextLink = "<a id= "NextPage" href=" + myNext + " class="call-btn"> >>> </a>" //here is where i have the link to renew the table
}
if (parseInt(data.page) <= parseInt(1)) {
myPrevLink = "___"
} else {
myPrevLink = "<a id= "PrevPage" href=" + myPrev + " class="call-btn"> <<< </a>" //here is where i have the link to renew the table
}
var nPage = "<tr>" + "<td> Número Página: " + parseInt(parseInt(data.page)) + myPrevLink + "____" + myNextLink + "</td>" + "</tr>"
var tResults = "<tr>" + "<td> Total Resultados: " + data.total_results + "</td>" + "</tr>"
var tPage = "<tr>" + "<td> Número Página: " + data.total_pages + "</td>" + "</tr>"
$(nPage).appendTo("#PageSelector tbody");
$(tPage).appendTo("#PageSelector tbody");
$(tResults).appendTo("#PageSelector tbody");
});
$.getJSON(action, function(data) {
$.each(data.results, function(i, f) {
var myPic = "https://image.tmdb.org/t/p/w500" + f.poster_path
var myBac = "https://image.tmdb.org/t/p/w92" + f.backdrop_path
var tblRow = "<tr>" + "<td>"
+ f.vote_count + "</td>" + "<td>"
+ f.id + "</td>" + "<td>"
+ f.video + "</td>" + "<td>"
+ f.vote_average + "</td>" + "<td>"
+ f.title + "</td>" + "<td>"
+ f.popularity + "</td>" + "<td>"
+ "<img src=" + myPic + ">" + "</td>" + "<td>"
+ f.original_language + "</td>" + "<td>"
+ f.original_title + "</td>" + "<td>"
+ f.genre_ids + "</td>" + "<td>"
+ "<img src=" + myBac + ">" + "</td>" + "<td>"
+ f.adult + "</td>" + "<td>"
+ f.overview + "</td>" + "<td>"
+ f.release_date + "</td>" + "</tr>"
$(tblRow).appendTo("#userdata tbody");
});
});
});
});
//Here are my function... that does not work!
$(".call-btn").click(function(aLink){
$("#userdata td").parent().remove();
$.getJSON(aLink, function(data) {
$.each(data.results, function(i, f) {
var myPic = "https://image.tmdb.org/t/p/w500" + f.poster_path
var myBac = "https://image.tmdb.org/t/p/w92" + f.backdrop_path
var tblRow = "<tr>" + "<td>"
+ f.vote_count + "</td>" + "<td>"
+ f.id + "</td>" + "<td>"
+ f.video + "</td>" + "<td>"
+ f.vote_average + "</td>" + "<td>"
+ f.title + "</td>" + "<td>"
+ f.popularity + "</td>" + "<td>"
+ "<img src=" + myPic + ">" + "</td>" + "<td>"
+ f.original_language + "</td>" + "<td>"
+ f.original_title + "</td>" + "<td>"
+ f.genre_ids + "</td>" + "<td>"
+ "<img src=" + myBac + ">" + "</td>" + "<td>"
+ f.adult + "</td>" + "<td>"
+ f.overview + "</td>" + "<td>"
+ f.release_date + "</td>" + "</tr>"
$(tblRow).appendTo("#userdata tbody");
});
});
});
</script>
<body>
<!-- Form part -->
<!-- bdd8feef -->
<!-- http://www.omdbapi.com/?i=tt0978762&apikey=bdd8feef -->
<!-- 1ca8226c006afb25adc4c816a2f8c184 -->
<!-- https://api.themoviedb.org/3/discover/movie?api_key=1ca8226c006afb25adc4c816a2f8c184 -->
<!-- https://api.themoviedb.org/3/search/movie?api_key=1ca8226c006afb25adc4c816a2f8c184&query=star+wars&page=1 -->
<!-- Just a button <button type="button">Click Me!</button> -->
<h2>Video</h2>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"> </script>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<form action="https://api.themoviedb.org/3/search/movie?api_key=1ca8226c006afb25adc4c816a2f8c184" method="post" target="_blank">
Buscar:<br>
<input type="text" name="query" value="black">
<br>
<br>
<button type="button" id="submitform">Submit</button>
</form>
<br><br><br>
<table id="PageSelector">
<thead>
</thead>
<tbody></tbody>
</table>
<div class="wrapper">
<div class="profile">
<table id= "userdata" border="2">
<thead>
<th>Total de votos</th>
<th>Id TMDB</th>
<th>Video</th>
<th>Promedio de votos</th>
<th>Titulo</th>
<th>Popularidad</th>
<th>Poster</th>
<th>Lenguaje original</th>
<th>Titulo Original</th>
<th>Generos</th>
<th>Background</th>
<th>Para Adultos</th>
<th>Sinopsis</th>
<th>Fecha de lanzamiento</th>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
</body>
</html>
但我不知道如何从这里调用该函数(如果可以…):
"<a id= "NextPage" href=" + myNext + " class="call-btn"> >>> </a>" //here is where i have the link to renew the table
“”//这里是我更新表的链接
使用该字符串,我创建了一个
,尝试让用户只转到项目的下一页,但不起作用
以下是我想要的seudo代码:
<a href="url" onclick="myFunction(url)"> link </a>
myFunction(url){
//to recreate the table using the JSON file
$.getJSON(url, function(data) {
$.each(data.results, function(i, f) {
var myPic = "https://image.tmdb.org/t/p/w92" + f.poster_path
var myBac = "https://image.tmdb.org/t/p/w92" + f.backdrop_path
var tblRow = "<tr>" + "<td>"
+ f.vote_count + "</td>" + "<td>"
+ f.id + "</td>" + "<td>"
+ f.video + "</td>" + "<td>"
+ f.vote_average + "</td>" + "<td>"
+ f.title + "</td>" + "<td>"
+ f.popularity + "</td>" + "<td>"
+ "<img src=" + myPic + ">" + "</td>" + "<td>"
+ f.original_language + "</td>" + "<td>"
+ f.original_title + "</td>" + "<td>"
+ f.genre_ids + "</td>" + "<td>"
+ "<img src=" + myBac + ">" + "</td>" + "<td>"
+ f.adult + "</td>" + "<td>"
+ f.overview + "</td>" + "<td>"
+ f.release_date + "</td>" + "</tr>"
$(tblRow).appendTo("#userdata tbody");
});
});
}
myFunction(url){
//使用JSON文件重新创建表
$.getJSON(url、函数(数据){
$.each(数据、结果、函数(i、f){
var myPic=”https://image.tmdb.org/t/p/w92“+f.poster_路
var myBac=”https://image.tmdb.org/t/p/w92“+f.U路
变量tblRow=“”+“”
+f.投票数+“”+“”
+f.id++
+f.video++
+f.投票表决平均数+++
+f.标题+“”+“”
+f.受欢迎程度+++
+ "" + "" + ""
+f.原始语言+++
+f.原始标题+“”+“”
+f.u id++
+ "" + "" + ""
+f.成人+“”+“”
+f.概述+“”+“”
+f.发布日期+“”+“”
$(tblRow).appendTo(“#userdata tbody”);
});
});
}
使用preventDefault
避免href行为:
myFunction(event, url) {
event.preventDefault();
}
您应该能够将
onclick=“myFunction(url)”更改为onclick=“returnmyfunction(this)”
,然后您的方法可以执行以下操作
myFunction(link){
//to recreate the table using the JSON file
//link.href is the href on the <a> clicked
$.getJSON(link.href, function(data) {
...
});
//return false to cancel the link processing
return false;
}
myFunction(link){
//使用JSON文件重新创建表
//link.href是已单击页面上的href
$.getJSON(link.href,函数(数据){
...
});
//返回false以取消链接处理
返回false;
}
href=“#”
,而不是href:“#”
,尽管我不认为这会以任何方式解决问题,我只是这么做了myNextLink=“”
现在做任何事情…使用“防止默认值”来避免hreg重定向脚本标记应位于
或
中。把它们放在别处是无效的。别把你自己的密码放在我的答录机里。把它放在你的问题或链接上。对不起,只是想给你看,但不会再发生了。只是想寻求帮助。你能分享一下你的问题中没有用的东西吗,或者在JSFIDLE上什么的吗?这是我的代码:只需在txt上复制并用.HTML保存它,然后运行它,单击SUBMIT
按钮,然后按>>
我想要的是在用户按>>
时看到第2页
myFunction(link){
//to recreate the table using the JSON file
//link.href is the href on the <a> clicked
$.getJSON(link.href, function(data) {
...
});
//return false to cancel the link processing
return false;
}