0

要素のPHP配列があります

ここで、配列要素ごとにリンクまたはボタンを作成したいと思います。クリックすると、配列値が特定の div 内に表示されます。

ここに私のコードがあります:

<?php
$array = array('apple', 'banana', 'orange');
foreach($array as $element) {
?>
    <a href="#" onclick="return false;" id="showElement"><?php echo $element; ?></a><br />
    <script type="text/javascript" charset="utf-8">
    $(document).ready(function(){
        $("#showElement").click( function() {
            $("#hot").append('<?php echo $element; ?><br />');
        });
    });
    </script>

    <?php
    }
    ?>
    <div id="hot"></div>

これは、私が望むようには機能しません。配列要素ごとに個別のリンクが表示されますが、最初のリンクをクリックすると、意図したものではなく、3 つの配列要素すべてが表示されます。他の 2 つのリンクは何もしません。

私のアプローチは完全に間違った方法でさえあるかもしれないので、私を正しい方法に導いてください。

ありがとう

4

3 に答える 3

5

あなたが実際に何を達成したいのかわかりませんが、懸念事項を分離する必要があります [つまり、php が js を直接混乱させないでください]。

属性を介して値を注入することを検討data-*し、後で次のように jQuery を介して値を取得します。

<?php foreach($array as $element): ?>

    <a href="#" class="yourClass" data-value="<?php echo $element; ?>"><?php echo $element; ?></a>

<?php endforeach; ?>

<div id="target"></div>

<script>

$(function(){

    var $target = $('#target')

    $('.yourClass').click(function(e){

        e.preventDefault()

        $target.append( $(this).data('value') )

    })

})

</script>

その場合、id属性は一意である必要があり、DOM 全体で繰り返すことはできないことに注意してください。

于 2012-12-29T17:22:03.047 に答える
1

これを試して

<?php
$array = array('apple', 'banana', 'orange');
foreach($array as $element) {
?>
    <a href="#" onclick="return false;" id="showElement-<?php echo $element; ?>"><?php echo $element; ?></a><br />
    <script type="text/javascript" charset="utf-8">
    $(document).ready(function(){
        $("#showElement-<?php echo $element; ?>").click( function() {
            $("#hot").append('<?php echo $element; ?><br />');
        });
    });
    </script>

    <?php
    }
    ?>
    <div id="hot"></div>

問題は、同じ ID を追加関数にバインドしていることです。ID名を変更しました。を使用して簡単に変更できます

$("#showElement-<?php echo $element; ?>")

とにかく、彼らは別のID名を取得します。

于 2012-12-29T17:23:01.813 に答える
1

どうですか：

<?php
$array = array('apple', 'banana', 'orange');
$i=0;
foreach($array as $element) {
    echo '<a href="#" class="showElement" id="showElement'.$i.'">'.$element.'</a><br />';
    $i++;
}
?>

それで

<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
    var $target = $('#target');
    $(".showElement").click( function(e) {
        e.preventDefault();
        $target.append( $(this).text() );
    });
});
</script>
于 2012-12-29T17:25:36.970 に答える