[英]jquery onclick function not defined
我有一个ajax脚本,我试图从一个函数发布。 我正在使用onlick href,但它不会出现未定义。 这是使用wordpress。 我试图在范围内外移动代码,但我似乎仍然无法让它工作。
<div id="live">
<div class="container">
<?php the_content(); ?>
<div id="comment-display">
<form method="post" action="index.php" id="comments_submit">
<input type="hidden" id="nameBox" value="<?php echo $_SESSION['name'] ?>" name="name"/>
<input type="hidden" id="emailBox" name="email" value="<?php echo $_SESSION['email']; ?>"/>
<textarea id="chatBox" placeholder="Ask a question or make a comment" name="comment" class="form-control"></textarea>
<a href="javascript:submitComment();" type="submit" id="submit" name="submit" class="btn cardh-bg text-white text-bold margin-top-5"> Submit Comment </a>
</form>
<br />
<div id="displayComments"></div>
</div>
</div>
</div>
<script type="text/javascript">
jQuery(function($) {
setInterval(function(){
$.ajax({
method: "GET",
url: "<?php echo get_template_directory_uri()?>/get_chat.php"
}).done(function(html){
$('#displayComments').html(html);
});
}, 2000);
function submitComment(){
$.ajax({
method: "POST",
url: "template-live.php",
data: {submitComment:$('#chatBox').val(),submitName:$('#nameBox').val(),submitEmail:$('#emailBox').val()}
}).done(function(html){
alert('Your comment has been submitted, and will be displayed after approval.');
$('#chatBox').val('');
});
}
});
</script>
谢谢 :)
当你做javascript:submitComment()
,它调用一个全局函数submitComment
。 由于submitComment
是在jQuery(function($) { ... })
函数中定义的,因此它不是全局的。 因此, window.submitComment
undefined
(因此undefined is not a function
)。
全局变量存储在window
对象中。
因此,您可以将submitComment
公开为全局:
window.submitComment = function () {...}
请注意,您应该尽可能避免使用全局变量。 在这种情况下,您可以通过添加:
$("#submit").click(submitComment);
// In this case, you shouldn't declare submitComment as a global anymore
由于您处于表单中,因此您希望在单击a
元素时停止默认浏览器行为,方法是在函数末尾使用return false
。
也可以选择@Ionică Bizău
的解决方案。
您可以使用onclick="submitComment()"
而不是href。
<a onclick="submitComment()" type="submit" id="submit" name="submit" class="btn cardh-bg text-white text-bold margin-top-5"> Submit Comment </a>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <div id="live"> <div class="container"> <?php the_content(); ?> <div id="comment-display"> <form method="post" action="index.php" id="comments_submit"> <input type="hidden" id="nameBox" value="<?php echo $_SESSION['name'] ?>" name="name" /> <input type="hidden" id="emailBox" name="email" value="<?php echo $_SESSION['email']; ?>" /> <textarea id="chatBox" placeholder="Ask a question or make a comment" name="comment" class="form-control"></textarea> <a onclick="submitComment()" type="submit" id="submit" name="submit" class="btn cardh-bg text-white text-bold margin-top-5"> Submit Comment </a> </form> <br /> <div id="displayComments"></div> </div> </div> </div> <script type="text/javascript"> jQuery(function($) { setInterval(function() { $.ajax({ method: "GET", url: "<?php echo get_template_directory_uri()?>/get_chat.php" }).done(function(html) { $('#displayComments').html(html); }); }, 2000); window.submitComment = function(){ console.log('submitComment called!'); $.ajax({ method: "POST", url: "template-live.php", data: { submitComment: $('#chatBox').val(), submitName: $('#nameBox').val(), submitEmail: $('#emailBox').val() } }).done(function(html) { alert('Your comment has been submitted, and will be displayed after approval.'); $('#chatBox').val(''); }); } }); </script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.