Javascript onclick 函数未定义答案

【问题标题】：Javascript onclick function undefinedJavascript onclick 函数未定义
【发布时间】：2018-01-31 08:41:33
【问题描述】：

我的 onclick 功能有问题

我的链接

<a id="reply" onclick="replyFunction({{$review->id}})"class="right-button">Reply</a>

功能：

function replyFunction(id){
  $('#reply').closest('div').append( $('.replyform'));
  $('.replyform').show();
  $('.replyform').attr('action', "/reply/submit/" + id);              
}

不知何故这不起作用

(index):155 Uncaught ReferenceError: replyFunction is not defined 在 HTMLAnchorElement.onclick

我已包含该文件，我认为它应该可以工作。

我想要做的是将 id 传递给函数。基本上，用户按下回复按钮 onclick 函数应该发送父 ID，并且使用 javascript 我应该更改用户将使用父 ID 填写操作的表单，以便我得到正确的路线（我正在使用 laravel）。

附：如果有更简单的方法可以做到这一点，我会很高兴听到它。

【问题讨论】：

把你的脚本放在body标签里面。 <script>function replyFunction(id){ }</script>
“我已经包含了文件，我认为它应该可以工作。”在询问之前你必须确定。请检查您浏览器的开发者控制台。
您是否在另一个函数中定义了replyFunction()？比如一个 jQuery document.ready 事件处理程序？如果是这样，那就是问题所在。它需要在全球范围内。另请注意，使用on* 事件属性是一种过时的不良做法，应该避免。改用不显眼的事件处理程序。
我使用了一个不同的文件，我在

标签： javascript jquery laravel

【解决方案1】：

如果你仍然使用 jQuery，你应该在那里设置事件监听器。并且由于replyFunction 是一个回调，它会获取一个事件作为参数而不是给定的值。

你应该

<div>
  <a id="reply" data-reviewId="{{$review->id}}" class="right-button">Reply</a>
</div>

和

(function ($) {
    $('#reply').on('click',function(e){
        e.preventDefault(); // do not follow the link or move to top
        var replyId = $(this).attr('data-reviewId');
        $(this).closest('div').append( $('.replyform'));
        $('.replyform')
            .show()
            .attr('action', "/reply/submit/" + replyId);
    })
})(jQuery);

但是这不是你打算做的，我猜。我更新了codepen。

如果您想添加一个表单并动态更改其操作，如果页面上有多个表单，您应该克隆一个虚拟对象并将其添加到所需位置。如果只有一种形式，可以给它一个id，通过id改变属性。

【讨论】：

感谢现在可以调用函数，但不知何故它没有改变属性
我又更新了脚本，也许你忘了把你的函数包装到那个自执行函数中！？
它成功了，很抱歉没有回到这里完全忘记它。感谢您的帮助

【解决方案2】：

您只能在脚本方面这样做：

var reply = document.getElementById("reply"); // $("#reply")
var review = document.getElementById("review"); // $("#reply")

然后在点击时引用你的函数

reply.onclick = () => { replyFunction(review); };

【讨论】：