不能单击按钮与加载了ajax [英] Cant click on button with is loaded with ajax

问题描述

我正在将内容加载到#result div中.在该内容中，有一个按钮. 在用ajax加载该控件后，我无法单击该按钮，但没有收到警报. (页面看不到它吗?:))

I am loading a content into a #result div. In that content, there is a button. After the contrnt was loaded with ajax, i cant click on that button, i dont get the alert. (the page doesnt see it? :))

<script type="text/javascript">
$(document).ready(function(e) 
{

    $('#printButton').hide();

    $('#submitButton').click(function(e)
    {
        var kat = $('#kategoria').val();
        $.ajax({
            type: 'POST',
            url: 'files/get_arlista_kategoria.php',
            data: { kat: kat },
            dataType: "html",
            cache: false,
            beforeSend: function(){
                $('#preloaderImage2').show();
            },
            success: function(data)
            {
                var result = $.trim(data);
                $('#result').html(result);
                $('#printButton').show();
            },
            complete: function(){
                $('#preloaderImage2').hide();
            }
        });
    });

    // This click doesnt work
    $('#savePrices').click(function(e)
    {
        alert("Its oké");
    });

});

</script>

ajax加载后，如何使用此按钮和输入?我想更新产品价格.

How can i work with this button and the input after the ajax loaded it? I want to update the product prices.

这是php文件，它会生成html内容:

And here is the php file, this generates the html content:

<?php
include_once("../../files/connect.php");
include_once("../../files/functions.php");
if(!empty($_POST))
{
    $kategoria = mysqli_real_escape_string($kapcs, $_POST['kat']);

    $sql = "SELECT termek_id, termek_nev, termek_akcio, termek_normal_ar, termek_akcios_ar, mertekegyseg_nev FROM termek
             LEFT JOIN webshop_mertekegyseg ON webshop_mertekegyseg.mertekegyseg_id = termek.termek_egyseg

            WHERE

            termek_id IN (SELECT kat_kapcs_termek_id FROM `termek_katgoria_kapcsolo` WHERE kat_kapcs_kategoria_id IN ($kategoria) ) ORDER BY termek_nev ASC";



    $get = mysqli_query($kapcs, $sql) or die(mysqli_error($kapcs));
    $num = mysqli_num_rows($get);
    if($num > 0 )
    {
        echo '<form method="post">';
        echo '<table class="form manufacturer-seo-form table table-hover">';
        echo '<thead style="font-weight:bold;">
                  <tr>
                    <td style="text-align: left;">ID</td>
                    <td class="left">Megnevezés</td>
                    <td style="text-align: left;">Egység</td>
                    <td>Bruttó ár</td>
                    <td>Akciós ár</td>
                    <td style="text-align: center;">Akciós</td>

                  </tr>
                </thead>';
        echo '<tbody>';
        while($i = mysqli_fetch_assoc($get))
        {
            ?>
                <tr id="sor<?php echo html($i['termek_id']); ?>">
                    <td style="text-align: left;"><?php echo html($i['termek_id']); ?></td>
                    <td class="left"><a title="Megnyitás" style="color:#333;" target="_blank" href="termek-szerkesztes.php?id=<?php echo html($i['termek_id']); ?>"><?php echo html($i['termek_nev']); ?></a></td>
                    <td style="text-align: left;"><?php echo $i["mertekegyseg_nev"] ?></td>
                    <td><input type="text" name="normal_ar" value="<?php echo html($i['termek_normal_ar']); ?>" /></td>
                    <td><input type="text" name="akcios_ar" value="<?php echo html($i['termek_akcios_ar']); ?>" /></td>
                    <td style="text-align: center;">
                        <select name="termek_akcio" class="input input-select" style="padding:5px 10px">
                            <?php
                            $ertek = intval($i['termek_akcio']);
                            $values = array("1" => "Igen", "0" => "Nem");
                            foreach($values AS $k => $v)
                            {
                                $selected = $ertek == $k ? ' selected="selected"':'';
                                echo '<option ' . $selected . ' value="' . $k . '">' . $v . '</option>';
                            }
                            ?>
                        </select>
                    </td>
                  </tr>
            <?php
        }
        echo '</tbody>';
        echo '</table>';
        echo '<div class="text-center"><button class="btn saveButton" type="button" id="savePrices">Módosítások mentése</button></div>';
        echo '</form>';
    }
    else
    {
        echo '<span style="display:block;margin:20px 0 20px 5px;"><b>A kiválasztott kategóriában nincsenek termékek.</b></span>';
    }
}
?>

推荐答案

您可以在元素(按钮)实际存在之前分配click事件函数.因此，没有将click事件绑定到的元素.您可以将click事件绑定到文档:

You assign the click event function before the element (button) actually exists. Therefore there is no element to bind the click event to. You can bind the click event to the document instead:

$(document).on('click', '#savePrices', function(e) {
    alert(...);
});

完全未经测试...

这篇关于不能单击按钮与加载了ajax的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！