PHP jQuery HTML - 获取自定义HTML属性 [英] PHP jQuery HTML - Getting custom HTML attribute

查看:67
本文介绍了PHP jQuery HTML - 获取自定义HTML属性的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个PHP文件,它会在系统中输出所有订单,并将自定义属性 oid (order-id)添加到所有链接。我的链接如下所示:

I have a PHP file which puts out all orders in the system and adds the custom attribute oid (order-id) to all the links. My links look like:

<a href='#' class='completeOrder' oid='$order_id'>$status</a>

这给出了正确的html,当我检查元素时我得到了这个

Which gives correct html, when I do inspect element I get this

<a href='#' class='completeOrder' oid='8'>Un-completed</a>

我想要做的是点击此链接,生成带有复选框和提交的表单按钮中有正确的订单ID,在其中发送html。所以我可以将表单和订单ID发送到另一个PHP文件进行处理(在这种情况下更新订单状态)。

What I would like to do is when this link is clicked, spawn a form with checkboxes and a submit button with the correct order ID in it's html to send. So I can send the form and the order id to another PHP file for processing ( in this case updating the order status ).

我正在做什么来生成表单复选框是使用jQuery AJAX调用,但当我尝试提醒订单ID以检查jQuery是否正确获取oid时它告诉我它未定义...:

What I am doing to spawn the form with the checkboxes is using a jQuery AJAX call, but when I try to alert the order ID to check if jQuery got the oid correctly it tells me its undefined... :

$("body").delegate(".completeOrder", "click", function(event) {
    event.preventDefault();
    getCompleteOrderTools();

    $(".content").toggleClass("hidden");
    $('div.hidden').fadeIn(800).removeClass('hidden');
    $("#notifications-drop").toggleClass('hidden');
});

function getCompleteOrderTools() {
    var o_id = $(this).attr('oid');
    alert(o_id);

    $.ajax({
        url:   "action.php",
        method: "POST",
        data: {
            getCompleteOrderTools: 1,
            orderId: o_id
        },
        success: function(data) {
            $(".row").append(data);
        },
    });
}


推荐答案

你的主要问题是你在错误的上下文中引用,因为您的函数 getCompleteOrderTools $ c>与您想要引用所需链接的点击事件的不同。

Your main issue was that you are referencing this in wrong context as the this available in your function getCompleteOrderTools is different that this that you wanted to refer for the click event of your desired link.

您有2个选择:

使用 jQuery(this).attr( 'oid');

使用jquery 数据属性

use jquery data attributes

< a href ='#'class ='completeOrder'data-oid ='$ order_id'> $ status< / a>

jQuery(this).data('oid');

所以你的代码 .attr 将如下所示:

So your code with .attr will look like :

$("body").delegate(".completeOrder", "click", function(event) {
    event.preventDefault();

    var myThis = $(this);//This is the 'this' corresponding to the link clicked

    getCompleteOrderTools(myThis);

    $(".content").toggleClass("hidden");
    $('div.hidden').fadeIn(800).removeClass('hidden');
    $("#notifications-drop").toggleClass('hidden');
});

function getCompleteOrderTools(myThis) {

    var o_id = myThis.attr('oid');
    alert(o_id);

    $.ajax({
        url:   "action.php",
        method: "POST",
        data: {
            getCompleteOrderTools: 1,
            orderId: o_id
        },
        success: function(data) {
            $(".row").append(data);
        },
    });
}

这篇关于PHP jQuery HTML - 获取自定义HTML属性的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆