如何在事件中重置jquery变量

Question

我的 html 结构中有一个 <a> 标记，其中有一个 <li> 标记（正如您在 html 代码中看到的那样），并且在该 <li> 里面有一个 data- 属性我'我试图用它传递一个 id。

我的页面中有几个<a> 标签，每个标签都会打开单独的引导模式。如您所见，每个 <a> 标签都有一个单独的 id，每个模态也有一个单独的引用 id。

HTML：

<a id="taskItemSettingsModalLink{{ $task->id }}" href="#taskItemSettingsModal{{ $task->id }}" data-toggle="modal">
    <li class="tk-task-box" data-task-id="{{ $task->id }}" data-task="{{ $task }}" data-task-status="{{ $task->status }}" data-list-id="{{ $list->id }}">{{ $task->name }}</li>
</a>

注意：这个 HTML 是用 laravel 刀片视图编写的；虽然，这些 {{ ... }} 标签属于刀片。

在 jquery 中，我想在单击时检索该数据属性并将其设置为名为 taskId 的 var。 我的问题是，根据我想要做的，我需要重置这个taskId 值并在每次单击<a> 标签并显示模式时将其清空。我发现没有办法这样做。但是，现在它只是将taskId 添加到前一个。

我的尝试：

• 将taskId设置为null：

$('a[id*=taskItemSettingsModalLink]').on('click', function () {
    taskId = null;
    var taskId = $(this).children('li').data('task-id');
    //...
});

• 将taskId 值设置为空：

$('a[id*=taskItemSettingsModalLink]').on('click', function () {
    taskId = val('');
    var taskId = $(this).children('li').data('task-id');
    //...
});

• 将taskId 值设置为undefined：

$('a[id*=taskItemSettingsModalLink]').on('click', function () {
    taskId = undefined;
    var taskId = $(this).children('li').data('task-id');
    //...
});

• 使用removeData()方法

• 使用delete：

delete taskId;

如上所述，我需要在每次点击<a> 标签时重置taskId，这意味着在每次模态节目中我都需要一个新的taskId。

重要提示：
我应该做的是在点击事件中设置taskId；因为我正在从li 中的a 标签中检索data-task-id。所以，我可以在事件内部定义taskId 变量。在我看来，我只能清空我声明变量的那一行...

Answer 1

您可以将其设置为undefined 或null。请参阅下面给出的示例。

let x = 10; //your variable
$('#demo').on('click' , function(){
    x = undefined // x = null
});

Answer 2

使用data 的第二个参数试试这个

$('a[id*=taskItemSettingsModalLink]').on('click', function () {
    var taskId = $(this).children('li').data('task-id');
    $(this).children('li').data('task-id', ''); // to reset it
});