JQuery: 无法使用相对路径访问 php 文件
JQuery: Cannot Access php file using Relative Path
真的很难找到一个相对路径来处理 Ajax 请求。
从 like.js 我想去 likeunlike.php
错误信息:
jquery-3.3.1.js:9600 POST http://localhost:8000/serverside/likeunlike.php 404(未找到)
文件结构:
JQuery:
$(document).ready(function(){
// like and unlike click
$(".content").on("click",".like",function(){
var id = $(this).attr("id"); // Getting Button id
var split_id = id.split("_");
var postid = split_id[1];
var userid = split_id[2];
// AJAX Request
$.ajax({
url: '../serverside/likeunlike.php',
type: 'post',
data: {postid:postid,userid:userid},
dataType: 'json',
success: function(data){
var likes = data['likes'];
var type = data['type'];
$("#likes_" + postid + "_" + userid).text(likes);
if(type == 1){
$("#like_" + postid + "_" + userid).css("color","lightseagreen");
}
if(type == 0){
$("#like_" + postid + "_" + userid).css("color","#ffa449");
}
}
});
});
});
已提供其中一个答案要求的索引文件。希望能帮助到你。
Index.php:
<?php
include "detail/config.php";
?>
<html>
<head>
<title>Talk</title>
<link href="style/style.css" type="text/css" rel="stylesheet" />
<script src="jquery/jquery-3.3.1.js" type="text/javascript"></script>
<script src="search/script/like.js" type="text/javascript"></script>
<script src="search/check/check.js" type="text/javascript"></script>
</head>
<script>
$(function() {
$('form').on("submit", function(e) {
e.preventDefault();
$('#error').text(""); // reset
var name = $.trim($("#search").val());
if (name.match(/[^a-zA-Z0-9 ]/g)) {
$('#error').text('Please enter letters and spaces only');
return false;
}
if (name === '') {
$('#error').text('Please enter some text');
return false;
}
if (name.length > 0 && name.length < 3) {
$('#error').text('Please enter more letters');
return false;
}
$.ajax({
url: 'search/search.php',
method: 'POST',
data: {
msg: name
},
dataType: 'json',
success: function(response) {
$(".content").html("")
$(".total").html("")
if(response){
var total = response.length;
$('.total') .append(total + " Results");
}
$.each(response, function() {
$.each($(this), function(i, item) {
var mycss = (item.Type == 1) ? ' style="color: #ffa449;"' : '';
$('.content').append('<div class="post"><div class="post-text"> ' + item.MessageText + ' </div><div class="post-action"><input type="button" value="Like" id="like_' + item.ID + '_' + item.UserID + '" class="like" ' + mycss + ' /><span id="likes_' + item.ID + '_' + item.UserID + '">' + item.cntLikes + '</span></div></div>');
});
});
}
});
});
});
</script>
<body>
<form action="index.php" method="post" id="myForm" autocomplete="on"><pre>
<input name="msg" id="search" type="text" autofocus value= "<?php if(isset($_POST['msg'])) {
echo htmlentities ($_POST['msg']); }?>"></input> <span id="error"></span>
<input type="submit" style="border:0; padding:0; font-size:0">
</pre></form>
<div class="total">
</div>
<div class="content">
</div>
</body>
</html>
jquery / js没有关于他位置的信息。
这应该可行。
var base_url = window.location.origin;
// like and unlike click
$(".content").on("click",".like",function(){
var id = $(this).attr("id"); // Getting Button id
var split_id = id.split("_");
var postid = split_id[1];
var userid = split_id[2];
// AJAX Request
$.ajax({
url: base_url + '/search/serverside/likeunlike.php',
type: 'post',
data: {postid:postid,userid:userid},
dataType: 'json',
success: function(data){
var likes = data['likes'];
var type = data['type'];
$("#likes_" + postid + "_" + userid).text(likes);
if(type == 1){
$("#like_" + postid + "_" + userid).css("color","lightseagreen");
}
if(type == 0){
$("#like_" + postid + "_" + userid).css("color","#ffa449");
}
}
});
});
});
我已经通过以下方式解决了这个问题:
使我的目录结构和文件名更简单。它被过度设计了。我现在有我的根文件夹,然后只是文件夹的下一级。
我苦苦挣扎的Ajaxurl路径被修改为'serverside/like.php',它获取了php文件但没有任何反应.
查看 like.php 代码,我有一个没有“;”的 include("../con/config.php")。我添加了它,它现在工作正常。
感谢大家的帮助。一如既往的感激。
新文件夹结构:
真的很难找到一个相对路径来处理 Ajax 请求。
从 like.js 我想去 likeunlike.php
错误信息:
jquery-3.3.1.js:9600 POST http://localhost:8000/serverside/likeunlike.php 404(未找到)
文件结构:
JQuery:
$(document).ready(function(){
// like and unlike click
$(".content").on("click",".like",function(){
var id = $(this).attr("id"); // Getting Button id
var split_id = id.split("_");
var postid = split_id[1];
var userid = split_id[2];
// AJAX Request
$.ajax({
url: '../serverside/likeunlike.php',
type: 'post',
data: {postid:postid,userid:userid},
dataType: 'json',
success: function(data){
var likes = data['likes'];
var type = data['type'];
$("#likes_" + postid + "_" + userid).text(likes);
if(type == 1){
$("#like_" + postid + "_" + userid).css("color","lightseagreen");
}
if(type == 0){
$("#like_" + postid + "_" + userid).css("color","#ffa449");
}
}
});
});
});
已提供其中一个答案要求的索引文件。希望能帮助到你。 Index.php:
<?php
include "detail/config.php";
?>
<html>
<head>
<title>Talk</title>
<link href="style/style.css" type="text/css" rel="stylesheet" />
<script src="jquery/jquery-3.3.1.js" type="text/javascript"></script>
<script src="search/script/like.js" type="text/javascript"></script>
<script src="search/check/check.js" type="text/javascript"></script>
</head>
<script>
$(function() {
$('form').on("submit", function(e) {
e.preventDefault();
$('#error').text(""); // reset
var name = $.trim($("#search").val());
if (name.match(/[^a-zA-Z0-9 ]/g)) {
$('#error').text('Please enter letters and spaces only');
return false;
}
if (name === '') {
$('#error').text('Please enter some text');
return false;
}
if (name.length > 0 && name.length < 3) {
$('#error').text('Please enter more letters');
return false;
}
$.ajax({
url: 'search/search.php',
method: 'POST',
data: {
msg: name
},
dataType: 'json',
success: function(response) {
$(".content").html("")
$(".total").html("")
if(response){
var total = response.length;
$('.total') .append(total + " Results");
}
$.each(response, function() {
$.each($(this), function(i, item) {
var mycss = (item.Type == 1) ? ' style="color: #ffa449;"' : '';
$('.content').append('<div class="post"><div class="post-text"> ' + item.MessageText + ' </div><div class="post-action"><input type="button" value="Like" id="like_' + item.ID + '_' + item.UserID + '" class="like" ' + mycss + ' /><span id="likes_' + item.ID + '_' + item.UserID + '">' + item.cntLikes + '</span></div></div>');
});
});
}
});
});
});
</script>
<body>
<form action="index.php" method="post" id="myForm" autocomplete="on"><pre>
<input name="msg" id="search" type="text" autofocus value= "<?php if(isset($_POST['msg'])) {
echo htmlentities ($_POST['msg']); }?>"></input> <span id="error"></span>
<input type="submit" style="border:0; padding:0; font-size:0">
</pre></form>
<div class="total">
</div>
<div class="content">
</div>
</body>
</html>
jquery / js没有关于他位置的信息。
这应该可行。
var base_url = window.location.origin;
// like and unlike click
$(".content").on("click",".like",function(){
var id = $(this).attr("id"); // Getting Button id
var split_id = id.split("_");
var postid = split_id[1];
var userid = split_id[2];
// AJAX Request
$.ajax({
url: base_url + '/search/serverside/likeunlike.php',
type: 'post',
data: {postid:postid,userid:userid},
dataType: 'json',
success: function(data){
var likes = data['likes'];
var type = data['type'];
$("#likes_" + postid + "_" + userid).text(likes);
if(type == 1){
$("#like_" + postid + "_" + userid).css("color","lightseagreen");
}
if(type == 0){
$("#like_" + postid + "_" + userid).css("color","#ffa449");
}
}
});
});
});
我已经通过以下方式解决了这个问题:
使我的目录结构和文件名更简单。它被过度设计了。我现在有我的根文件夹,然后只是文件夹的下一级。
我苦苦挣扎的Ajaxurl路径被修改为'serverside/like.php',它获取了php文件但没有任何反应.
查看 like.php 代码,我有一个没有“;”的 include("../con/config.php")。我添加了它,它现在工作正常。
感谢大家的帮助。一如既往的感激。
新文件夹结构: