クエリ文字列に入力値を渡そうとしましたが、なぜ失敗しましたか？

Question

私はこのコードをページに持っています。

<input type="text" value="Enter your video URL here..." size="30" class="video_url" /> 

<input type="button" value="Preview" class="preview_button" /> 

<div id="preview"></div> 

<script type="text/javascript"> 
(function($) { 

    $(".preview_button").click(function(){ 

     var url = $('.video_url').val(); 

     $("#preview").load('<?php bloginfo('template_directory'); ?>/templates/preview.php?url=' + url); 

    }); 

}) (jQuery); 
</script> 

ただし、私はurl値を見ることができません。私が間違っていることは何ですか？

Answer 1

encodeURIを試しましたか？

$("#preview").load('<?php bloginfo('template_directory'); ?>/templates/preview.php?url=' + encodeURI(url)); 

Answer 2

同じページに、クラスがvideo_urlの別の要素がありますか？クラスは必ずしも一意ではないので、IDを使用します。