在我的wordpress网站中,我插入输入字段并使用Ajax获取数据。
这是Jquery:
<script>
$(function() {
$('body').on('click', '.post-link', function() {
$('#post-cont').fadeIn();
var post_names = '';
var ajax = {};
ajax.id = $(this).attr('rel');
var ajaxurl = '<?php echo site_url() ?>/wp-admin/admin-ajax.php';
jQuery.post(ajaxurl, {
'action': 'get_img_post_and_title',
'data': ajax
}, function(response) {
if (response.success) {
if (post_names === '') {
post_names = 'aa';
} else if (post_names === 'aa') {
post_names = 'ab';
} else if (post_names === 'ab') {
post_names = 'ac';
} else {
post_names = 'ad';
}
if ($('#post-cont input').length <= 4) {
$('#post-cont').append('<div class="rows"><input name="' + post_names + '" value="' + response.data.post_id + '"> ' + response.data.post_title + ' <img src="' + response.data.post_thumb + '"/></input></div>');
}
}
});
});
});
</script>
PHP:
add_action("wp_ajax_get_img_post_and_title", "get_img_post_and_title");
add_action("wp_ajax_nopriv_get_img_post_and_title", "get_img_post_and_title");
function get_img_post_and_title(){
$return = array(
'post_id' => $_POST['data']['id'],
'post_title' => get_the_title($_POST['data']['id']),
'post_thumb' => wp_get_attachment_image_url(get_post_thumbnail_id($_POST['data']['id'])),
);
wp_send_json_success($return);
}
使用此脚本,我尝试控制max number of input field to 4
,然后从aa, ab, ac, ad
分配自定义名称。
此脚本成功添加了最大值4但仅为所有错误分配了aa
名称。
如何为所有插入的字段分配4个不同的名称?
答案 0 :(得分:1)
请尝试以下代码捕捉:
<script>
var custom_input_names = ['aa', 'ab', 'ac', 'ad'];
$(function() {
$('body').on('click', '.post-link', function() {
$('#post-cont').fadeIn();
var post_names = '';
var ajax = {};
ajax.id = $(this).attr('rel');
var ajaxurl = '<?php echo site_url() ?>/wp-admin/admin-ajax.php';
jQuery.post(ajaxurl, {
'action': 'get_img_post_and_title',
'data': ajax
}, function(response) {
if (response.success) {
for (var i=0; i<custom_input_names.length; i++) {
if ($('#post-cont').find('input[name=' + custom_input_names[i] + ']').length < 1) {
$('#post-cont').append('<div class="rows"><input name="' + custom_input_names[i] + '" value="' + response.data.post_id + '"> ' + response.data.post_title + ' <img src="' + response.data.post_thumb + '"/></input></div>');
break;
}
}
}
});
});
});
</script>
如果您希望限制超过4,则可以向custom_input_names
添加更多元素。
例如,如果您想要最多7,那么您可以更改custom_input_names
,如下所示:
var custom_input_names = ['aa', 'ab', 'ac', 'ad', 'ae', 'af', 'ag'];
答案 1 :(得分:0)
您的代码中存在拼写错误,导致post_names
状态无法更新到上次使用的输入字段名称。删除1
,它应该工作! (您的变量在其中一行代码中称为post_names1
!); - )
if (post_names === '') {
post_names = 'aa';
} else if (post_names**l** === 'aa'){
post_names = 'ab';
} else if (post_names === 'ab'){
post_names = 'ac';
} else {
post_names = 'ad';
}
修复了(也改变了最后一个将它设置为ad
一点,只是为了确定):
if (post_names === '') {
post_names = 'aa';
} else if (post_names === 'aa'){
post_names = 'ab';
} else if (post_names === 'ab'){
post_names = 'ac';
} else if (post_names === 'ac'){
post_names = 'ad';
}
除此之外,每次运行此函数时,您都会重置post_names
的状态。您应该将post_names = ''
移出功能。
var post_names = '';
if (response.success) {
if (post_names === '') {
post_names = 'aa';
} else if (post_names === 'aa') {
post_names = 'ab';
} else if (post_names === 'ab') {
post_names = 'ac';
} else {
post_names = 'ad';
}
if ($('#post-cont input').length <= 4) {
$('#post-cont').append('<div class="rows"><input name="' + post_names + '" value="' + response.data.post_id + '"> ' + response.data.post_title + ' <img src="' + response.data.post_thumb + '"/></input></div>');
}
}
答案 2 :(得分:0)
什么会好......
<input>
答案很长......;)
if (response.success) {
$form = '<div class="rows">' +
'<form method="POST" action="data.php">' +
' <input type="hidden" name="id" value="' + response.data.post_id + '">' +
' <div class="input_container">' +
' <input type="submit" class="myinput" value="' + response.data.post_title + '">' +
' <img src="' + response.data.post_thumb + '" id="input_img">' +
' </div>' +
'</form>' +
'</div>';
$('#post-cont').append($form);
}
css part:
.input_container {
position:relative;
padding:0;
margin:0;
}
.myinput {
height:20px;
margin:0;
padding-left: 30px;
}
.input_container img {
position:absolute;
bottom:8px;
left:10px;
width:10px;
height:10px;
}
在data.php中
$ID = $_POST['id'];
echo get_post_meta( $ID, 'brand', true );