/ / jquery click function vnútri php slučky - php, jquery, loop, click

funkcia jquery click vo vnútri php slučky - php, jquery, slučky, kliknite

Mám foreach slučku v PHP, ako je uvedené nižšie.

<?php
$i = 0;
foreach ($query as $value) { ?>
<button id="show[<?php echo $i;?>]" class="btn btn-success" type="button">View</button>
<div id="blah[<?php echo $i;?>]">Joel</div>
<?php
$i++
} ?>

Teraz táto slučka funguje dobre a dostávam id pre každé tlačidlo a delí s jedinečným id. Chcem však pridať funkciu kliknutia ako je uvedené nižšie.

$("#show").click(function(){
$("blah").hide();
});

Ale pretože je to vo vnútri slučky a majú s sebou rôzne ID, ako pridať túto funkciu jQuery pre jednotlivé tlačidlá?

odpovede:

7 pre odpoveď č. 1
$(".btn").click(function(){
var id = $(this).attr("id");
var n = id.replace("show","");
$("#blah"+n).hide();
});

Vymeňte aj vaše tlačidlá za tento kód

<button id="show-<?php echo $i;?>" class="btn btn-success" type="button">Clear</button>
<div id="blah-<?php echo $i;?>">Joel</div>

3 pre odpoveď č. 2

pre php:

<?php foreach ($query as $key => $value) {?>
<button class="btn btn-success blah-toggler" type="button" data-target="blah-<?php echo $key ?>">
<div id="blah-<?php echo $key ?>">Joel</div>
<?php }?>

potom v jQuery:

$(".blah-toggler").on("click", function(){
var t = $(this);
$("#" + t.data("target")).hide();
});

2 pre odpoveď č. 3

Použite triedu

<button id="show[<?php echo $i;?>]" class="btn btn-success mybutton" type="button">

potom

$(".mybutton").click(function(){
$("blah").hide();
});

2 pre odpoveď № 4

Prípadne môžete použiť aj triedu. Potom obvyklé:

<?php $i = 0; ?>
<?php foreach ($query as $value): ?>
<button class="btn btn-success toggle" type="button">
<div id="blah[<?php echo $i;?>]">Joel</div>
</button> <!-- missed a closing button tag -->
<?php $i++; ?>
<?php endforeach; ?>


<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">

$(document).ready(function(){

$(".toggle").on("click", function(){
$(this).children("div").hide();
});

});
</script>

2 pre odpoveď № 5

u by mal používať po

PHP:

<?php
$i = 0;
foreach ($query as $value) { ?>
<button id="show[<?php echo $i;?>]" class="btn btn-success clickEvent" type="button">
<div id="blah[<?php echo $i;?>]">Joel</div>
<?php
$i++
} ?>

Tu pridáte class = "clickEvent" pretlačidiel. A na konci bude mať súbor jScript s nasledujúcim obsahom. Ktorý sa postará o to, čo by sa malo stať, keď kliknete na tlačidlo s touto triedou.

jQuery:

$(".clickEvent").click(function(){
$(this).next("div").hide();
});

2 pre odpoveď č. 6

PHP:

<?php
$i = 0;
foreach ($query as $value) { ?>
<button id="show_<?php echo $i;?>" onclick=show(this.id) class="btn btn-success" type="button">
<div id="blah_<?php echo $i;?>">Joel</div>
<?php
$i++
} ?>

javascript:

function show(id)
{
var arr = id.split("_");
$("#blah_"+arr[1]).hide("slow");
}