使用html数据集id's的未定义变量

Undefined variables using html dataset id's

本文关键字：未定义 变量 html 数据集 id 使用      更新时间：2023-09-26

这个问题是我之前问过的给元素指定多个名称/id的问题的延续。第二个答案显示了给元素提供多个属性的更好方法。

然而，将这种方法应用于我的工作后。我的javascript变量没有定义。

我的html: 

<a data-toggle="modal" data-id="prodModal" data-presId="<?php echo $selectPresForJs->valueof('pres_id'); ?>" data-prodId="<?php echo $prod->prod_id; ?>" data-target="#prodModal" class="image_modal" >
                    <img class="image-modal" style="width: 192px; height:192px;" src="<?php echo $prod->prod_icon; ?>">
                    <span ><h2 style='color:#2468A6'><b><?php echo $prod->prod_name ?></b></h2></span>
                </a>
我javascript 

$(document).ready(function(){

 $('#prodModal').click(function() {

        var ajaxprodId = $('#prodModal').data('prodId');
        var ajaxpresId = $('#prodModal').data('presId');
              /*Console Prints the variables as undefined*/  
          console.log(ajaxprodId);
          console.log(ajaxpresId);
        $.ajax({
        url: "path/to/file/Presentation.php",
        type: "POST",
        data: {prodId : ajaxprodId,presId:ajaxpresId}

        ,success: function(data){
         console.log("Success was achieved");
         document.getElementById("modal_content").innerHTML = "Works";
      },
      error: function(data){
          console.error("The action was unsuccessfull");
          alert(data);
      }

    });
}); 

});

1。我如何修复/改变我的代码，使变量ajaxprodId和ajaxpresId不是未定义的?

2。正确的地方是让ajax替换innerHTML，因为当前位置仅在模式打开，关闭然后再次打开后才有效

当您使用选择器$('#prodModal')时，您引用的是一个DOM元素，其属性id设置为prodModal。那个id和你的data-id不一样。

所以当你使用$('#prodModal')时你什么也得不到因为没有任何元素包含id

相关文章：