jQueryとPHPで書かれたハイパーリンクonclick

Question

私は後で整理するつもりのない醜いPHPコードを持っていますが、まずコードが正常に動作するはずです。これでpostコマンドは実行されません。つまり、スクリプトfind.phpは実行されません。任意のアイデアはどのようにこの問題を解決するには？私はちょうど1つのハイパーリンクを使いたいと思う。すべての正直で

<?php 

    print "<div><div>Play " . $i . "<span><a href=\"#\" onclick=\"$.post('find.php', { 'my': '$my_id', 'your': '$your', 'select': '$i' }); $('html').css({ 'overflow': 'auto', 'height': 'auto' }); this.parentNode.style.display = 'none'; return false;\">Select</a></span></div></div>\n"; 

?> 

Answer 1

、あなたは今、あなたのコードをクリーンアップしたほうが良いと思います。コンソールをチェックすると、jQueryがロードされていないというエラーが発生する可能性が高くなります。

あなたが適切に必要な情報を持つボタンを作成する必要があります。

<a href="#" class="mybutton" data-my-id="<?php echo $my; ?>" data-your-id="<?php echo $your; ?>" data-select="<?php echo $i; ?>">Select</a> 

とjQueryでイベントリスナーを作成します。

jQuery(document).ready(function() { 
    // handle click 
    jQuery(document).on('click', 'a.mybutton', function(e) { 
     e.preventDefault(); 
     var data = { 
      my: jQuery(this).data('my-id'), 
      your: jQuery(this).data('your-id'), 
      select: jQuery(this).data('select'), 
     } 
     //post 
     jQuery.post('find.php', data); 
     alert(data.select); 
     jQuery('html').css({ 'overflow': 'auto', 'height': 'auto' }); 
    this.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.style.display = 'none'; return false; 

    }); 
}); 

そこから、あなたが合うように、それをクリーンアップする必要がありますまさにあなたが必要とするものです。私があなたの場合は、の代わりに正しいコード/パスを頭に入れてください。

Answer 2

jquery postを実行するハイパーリンクを使ってdivを動的に作成すると思われます。あなたは完全にはJavaScript自体にこれを達成することができます - あなたのコードから

function postFunc(my_id, your, i) { 
    $.post('find.php', { 
    'my': my_id, 
    'your': your, 
    'select': i 
    }); 
} 

function createDynamicDiv(my_id, your, i) 
{ 
    var node = document.createElement('div'); //dynamically creates a div 
    node.setAttribute("style", "overflow: auto; height: auto"); //set css 
    newlink = document.createElement('a'); 
    newlink.setAttribute('class', 'dynamicDiv'); //you might want to group all divs in a common class to add common css 
    newlink.setAttribute('href', 'javascript:postFunc(my_id,your,i)'); //javascript: prefix on the href makes to interpret postFunc as a javascript function 
    node.appendChild(newlink); 

} 

コールcreateDynamicDivダイナミックdiv要素を作成します。