wp ajax/jquery 在插入 div 内容后无法使用表单

Question

将表单添加到 div 后，表单无法与 ajax jquery 一起正常工作，id 没有被发送/发布到 jquery 函数，因此消息没有内容和接收者 id。

我按下用户按钮：

<jquery-form formmethod='post'>
            <input type="submit" onclick="js_vis_melding_liste(<?php echo $tempid; ?>)" value="<?php echo $userbutton->first_name . ' ' . $userbutton->last_name; ?>"/><br/>
        </jquery-form>

启动js函数：

function js_vis_melding_liste(motid) {
    jQuery.ajax({
        url: my_ajax_script.ajaxurl,
        type: 'POST',
        data: ({action: 'liste_meldinger', mottaid: motid}), //utfører liste_meldinger funksjonen og mulighet for å hente mottaid via $_POST
        success: function(tingting) {
            jQuery('#ham-meldinginnboks').html(tingting); //laster inn resulatet av liste_meldinger funksjonen inn i div
            jQuery('#ikkevalgtmottakerdiv').hide(); //skjulerdiven
            jQuery('#ham-meldinginnboks').show();
            var objDiv = document.getElementById("meldinglisten1"); //denne og neste linje sørger for at scrollbar er nederst
            objDiv.scrollTop = objDiv.scrollHeight;
        }
    });
}
;

使用functions.php中的php函数：

function liste_meldinger() {

    $mottakid = $_POST['mottaid'];
    global $current_user, $wpdb, $valgt_mottaker;
    $mottaker = get_user_by('id', $mottakid);

    $valgt_mottaker = $mottakid;
    $curUserId = get_current_user_id();
    $meldingliste =
            $wpdb->get_results("
        SELECT c.inn AS innh, mottakerid, datom
FROM
(
    SELECT innhold AS inn, datom, mottakerid
    FROM meldinger
    WHERE mottakerid = '$curUserId' and senderid = '$mottakid'

    UNION

    SELECT innhold AS inn, datom, mottakerid
    FROM meldinger
    WHERE senderid = '$curUserId' and mottakerid = '$mottakid'
) AS c
ORDER BY datom ASC", ARRAY_A);
    $sendinfo = "<p>Liste over meldinger mellom deg og $mottaker->first_name $mottaker->last_name.</p><br/>
            <div id='meldinglisten1' style='overflow-y: auto;height: 400px;'>";

    foreach ($meldingliste as $meldinger):

        $melding = $meldinger['innh'];
        $datomo = $meldinger['datom'];
        if ($meldinger['mottakerid'] == $curUserId) {
            $sendinfo .= $datomo . ' - ' . $mottaker->first_name . ' ' . $mottaker->last_name . ' sa:';
        } else {
            $sendinfo .= $datomo . ' - ' . $current_user->first_name . ' ' . $current_user->last_name . ' sa:';
        }


        $sendinfo .= "<div style='border:1px solid #dedede'><p>";
        $sendinfo .= $melding;
        $sendinfo .= "</p>
        </div>
        <br/>";
    endforeach;
    $sendinfo .= '</div>

    <div>
        <jquery-form name="sendersvarform" id="sendersvarform" onsubmit="js_svar_melding();" >
            Skriv ny melding til ' . $mottaker->first_name . ' :<br/>
            <textarea name="meldinginnhold" id="meldinginnhold" rows="3" cols="20"></textarea> <br/>
            <input type="hidden" name="idmot" id="idmot" value="' . $mottakid . '" />
                <input  type="submit" name="submit" id="svarmelding" value="Send Svar"/>
        </jquery-form>
    </div>';

    echo $sendinfo;
    die();
}

它会显示消息和一个回复框，即 id=sendersvarform 按回复，它使用 js_svar_melding 函数：

function js_svar_melding() {
    var arr = jQuery('#sendersvarform').serialize();
    arr += '&action=svar_melding';
    jQuery.ajax({
        url: my_ajax_script.ajaxurl,
        type: 'POST',
        data: arr,
        success: function(mld) {
            alert(mld);
        }
    });
    return false;
}
;

再次使用 php 函数 svar_melding:

function svar_melding() {
    global $wpdb, $current_user;

    $userID = $current_user->ID;
    if (!empty($_POST['idmot']) && !empty($_POST['meldinginnhold'])) {
        $sid = $userID;
        $mid = $_POST['idmot'];
        $mldinnhold = $_POST['meldinginnhold'];

        ham_sendmelding($sid, $mid, $mldinnhold);
        echo "melding sendt.";
    } else {
        echo "Ikke alle feltene er fylt inn.";
    }
    die();
}

似乎 $_POST['idmot'] 和 $_POST['meldinginnhold'] 是空的，因为如果我不使用 if !empty 那么它将创建一条消息但它没有 id 或内容，它应该已经发布了信息但它没有，它重新加载页面回到主页，它不应该因为js_svar_melding中的返回false，请帮助

Answer 1

找到了我猜的答案。 通过使用 .on

jQuery("#sendersvarform").on("submit", false);

它将“激活”提交表单#sendersvarform 时发生的事件。 创建表单后激活它。

function js_vis_melding_liste(motid) {
    jQuery.ajax({
        url: my_ajax_script.ajaxurl,
        type: 'POST',
        data: ({action: 'liste_meldinger', mottaid: motid}), //utfører liste_meldinger funksjonen og mulighet for å hente mottaid via $_POST
        success: function(tingting) {
            jQuery('#ham-meldinginnboks').html(tingting); //laster inn resulatet av liste_meldinger funksjonen inn i div
            jQuery('#ikkevalgtmottakerdiv').hide(); //skjuler diven
            jQuery("#sendersvarform").on("submit", false);
            jQuery('#ham-meldinginnboks').show();
            var objDiv = document.getElementById("meldinglisten1"); //denne og neste linje sørger for at scrollbar er nederst
            objDiv.scrollTop = objDiv.scrollHeight;
        }
    });
}
;