Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I try create a quick comment form on my wordpress with a link like this: enter image description here

My plan is when you click this link,you get a comment form with jquery show() function, where you can add a comment in ajax.
jquery:

 $.noConflict();
 jQuery( ".comment-mezo" ).click(function() {
 jQuery( "#comment-mezo" ).show( "slow" );
});

html:

<a href="#" class="comment-mezo">Quick comment</a>
<div id="comment-mezo" style="display: none">
  <textarea id="comment"></textarea><br>
   <input type="submit">
</div>

This function work outside wordpress(i tryed it on jsbin), but inside not.
Why?
We know this thanks for Rares P and sri.:
The jquery is loaded and working.
The id change not help.
The show.js is loaded when the paged is loaded.
And we use this for the script load:

<?php
   function show() {
  wp_enqueue_style( 'style-name', get_stylesheet_uri() );
  wp_enqueue_script( 'script-name', get_template_directory_uri() . '/show.js', array() );
   }
   add_action( 'wp_enqueue_scripts', 'show' );?>
share|improve this question

closed as off-topic by Chip Bennett, toscho Oct 23 '13 at 12:30

This question appears to be off-topic. The users who voted to close gave this specific reason:

  • "Questions should be specific to WordPress within defined scope (merely happening in its context, such as generic PHP/JS/HTML/CSS, is insufficient). Might be better asked at Stack Overflow or other appropriate site of Stack Exchange network." – toscho
If this question can be reworded to fit the rules in the help center, please edit the question.

    
Close-voted as too localized. The limited subset of WordPress-specific jQuery issues has been adequately covered in existing WPSE questions and answers. Please search the site to find one that addresses your issue. –  Chip Bennett Oct 23 '13 at 11:59
    
This very wordpress specifick,becouse this function work on jsbin but on wordpress not. I'm searched it the solution everywhere not jut here,but I not found,becouse I gess no exists solution for this. –  Szántai Ádám Oct 23 '13 at 12:08
    
You cannot use the same id multiple times in one document, this is invalid HTML and it breaks JavaScript. Not WordPress specific, sorry. –  toscho Oct 23 '13 at 12:29
    
I chanced the id,but this not solve my problem,so this is a wordpress problem. You can change the id-s to something else,but this not go work. –  Szántai Ádám Oct 23 '13 at 12:31

3 Answers 3

WordPress runs $.noConflict(); by default.

You attempting to run it again manually likely throws a

TypeError: Cannot call method 'noConflict' of undefined

Make use of your browser's JS console rather than jsbin...

share|improve this answer
    
I'm not see this error on my website. –  Szántai Ádám Oct 23 '13 at 12:05

1. Try to see if your js is loaded. Try this by adding: alert("test"); and refresh the website. If the "test" message doesn't appear it means that the js is not loaded.

Here's the best way to load js: http://codex.wordpress.org/Function_Reference/wp_enqueue_script

2. If js is loaded, I guess you have some errors

Download Firebug addon for your browser. Activate it, browse your website, right click somewhere on the website and select "Inspect this element with Firebug". You will see a window appearing on the footer of your website. Select the "Console" window, and there you'll see if there's any Javascript / jQuerry error.

share|improve this answer
    
Like this:? $.noConflict(); jQuery( ".comment-mezo" ).click(function() { jQuery( "#comment-mezo" ).show( "slow" ); }); function display_alert() { alert("Hello! I am an alert box!!"); } –  Szántai Ádám Oct 23 '13 at 8:37
    
add alert("test"); to be the first line of your js file. If works, add it to be the first line after jQuery( ".comment-mezo" ).click(function() { - to see if it identifies the click action –  Rares P. Oct 23 '13 at 8:40
    
I tryed this: add alert("test"); $.noConflict(); jQuery( ".comment-mezo" ).click(function() { jQuery( "#comment-mezo" ).show( "slow" ); }); But nothing happening, I click on the link,and not load on:D Briliant -.-" :D –  Szántai Ádám Oct 23 '13 at 8:50
    
it means that the javascript file is not loaded. You should go to the header.php file from your theme and load the javascript file from there. In the message above you can see the best way to load a js file. –  Rares P. Oct 23 '13 at 8:53
2  
Please do not use comments for excessive discussion, they aren't meant for that. Update question or answer with additional details as appropriate. –  Rarst Oct 23 '13 at 9:50

I think the problem might be because of the use of same id for all the div elements. Try giving unique id for every div element that follows the Quick Comment link.

share|improve this answer
    
I changed the <a class="comment-mezo">to <a class="comment-mezo-mutat"> but still not working –  Szántai Ádám Oct 23 '13 at 9:20
    
I didn't mean the anchor tag. I meant for the div element that follows. Use ids something like comment-mezo1, comment-mezo2 etc... Ids are supposed to be unique. –  sri Oct 23 '13 at 9:22
    
Oh okey i understand you. I chanched the div id to: id="comment-mezo2" but still not work –  Szántai Ádám Oct 23 '13 at 9:25
    
Please, if you could, share your code on jsfiddle or jsbin. –  sri Oct 23 '13 at 9:26
1  
It is not Wordpress problem. As i understand, you have multiple blog posts on a single page and you would want to add comments. So you should develop a logic that gives unique ids for each blog post(just like i showed you). Only then you can achieve what you want. If you check your website, my guess is, you are having the same id used more than once. If it is true, that is the problem and nothing else. Please remember IDs must be unique for JavaScript to work properly. –  sri Oct 23 '13 at 10:09

Not the answer you're looking for? Browse other questions tagged or ask your own question.