是否有可能从foreach循环中获取attr值

I tried this code but it alerts undefined

<?php 
    foreach($result1 as $res1)
    {
            $user_id = 5;
?>
        <form name="wish" method="post" action="javascript:void(0);">
        <input type="submit" class="submit_wish1" id="calButton" data-wid="<?php echo $res1->user_id; ?>" data-uid="<?php echo $user_id; ?>" value="" onclick="favfunction()"/>
        </form>
<?php
    }
?>


<script>
    function favfunction()
    {
        calBtn = $(this).attr('data-wid');
        calBtn1 = $(this).attr('data-uid');
        alert(calBtn);
        alert(calBtn1);

    }
</script>

when I use

    calBtn = $('#calButton').attr('data-wid');
    calBtn1 = $('#calButton').attr('data-uid');

it alerts same values.

What I would suggest is that you pass the DOM object itself into your function

onclick="favfunction(this);"

And then you can do this in your JS

<script>
function favfunction(elm)
{
    var calBtn = $(elm).attr('data-wid');
    alert(calBtn);
}
</script>

More than likely, the root of your issue is with using the same id for your submit buttons.

<form name="wish" method="post" action="javascript:void(0);">
<?php 
    $i = 1;
    foreach($result1 as $res1)
    {
        $user_id = 5;
?>
    <input type="submit" class="submit_wish1" id="calButton_<?php echo $i; ?>" data-wid="<?php echo $res1->user_id; ?>" data-uid="<?php echo $user_id; ?>" value="" onclick="favfunction(this)"/>

<?php
    $i += 1;
    }
?>
</form>

there should only be 1 form tag in an html document.

elements should not have the same ids, so we're appending a number to the id, that correlates to the iteration of the foreach loop.


<script>
function favfunction(elm)
{
    var wid = $(elm).data('wid'),
        uid = $(elm).data('uid');

    alert('wid: ' + wid + ' - uid: ' + uid);
}
</script>

Code Snippet Sample

with Sample Php output.

    function favfunction(elm)
    {
        var wid = $(elm).data('wid'),
            uid = $(elm).data('uid');
  
        alert('wid: ' + wid + ' - uid: ' + uid);
    }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
 
<form name="wish" method="post" action="javascript:void(0);">
  <input type="submit" class="submit_wish1" id="calButton_1" data-wid="1" data-uid="5" value="Submit" onclick="favfunction(this)" />
  <input type="submit" class="submit_wish1" id="calButton_2" data-wid="2" data-uid="5" value="Submit" onclick="favfunction(this)" /> 
  <input type="submit" class="submit_wish1" id="calButton_3" data-wid="3" data-uid="5" value="Submit" onclick="favfunction(this)" />
  <input type="submit" class="submit_wish1" id="calButton_4" data-wid="4" data-uid="5" value="Submit" onclick="favfunction(this)" /> 
  <input type="submit" class="submit_wish1" id="calButton_5" data-wid="5" data-uid="5" value="Submit" onclick="favfunction(this)" /> 
</form>

</div>