Question

我在php中有一个页面，当我点击div时，我试图为它添加一个？id = variable_value扩展名，但当我点击它时会给我一个未定义的url错误扩展名

这是脚本：

＆＃13;

<script language="javascript" type="text/javascript">

    var Pokemon_ID = 1;
    
    function changeUrl() {
        location.href=this.href+'?id='+Pokemon_ID;return false;
    }
    
    document.getElementById( 'right-btn' ).onclick = function() {
        changeUrl();
    };

</script>

＆＃13;

而div：

＆＃13;

<div id="right-btn" href="pokedex.php" onclick="changeUrl()">

＆＃13;

Answer 1

当您只需要一个处理程序时，请不要使用两种单独的方法来连接处理程序。内联事件处理程序在HTML标记中基本上是eval - 它们是不好的做法，导致代码很差，难以管理的代码。请认真考虑使用JavaScript附加事件。

问题在于，当通过onclick分配处理程序时，this中的changeUrl未定义，因为调用上下文是全局的。当它可能引起混淆时，请尽量避免使用this。

单独使用addEventListener。此外，您必须使用getAttribute('href')代替.href，因为div不应具有href属性。

const Pokemon_ID = '5';
document.getElementById('right-btn').addEventListener('click', function(e) {
  // location.href = e.target.getAttribute('href') + '?id=' + Pokemon_ID;
  console.log('changing URL to ' + e.target.getAttribute('href') + '?id=' + Pokemon_ID);
});

<div id="right-btn" href="pokedex.php">text</div>

Answer 2

请改为尝试：

location.href += '?id=' + Pokemon_ID;

Answer 3

因为你在onclick方法中调用了changeUrl（），所以你会忽略它的上下文。这在changeUrl中不是你的div。也许您必须将此传递给changeUrl(this)的方法，或者只是将href传递给changeUrl(this.href)。

比使用：

function changeUrl(target){ location.href=target.href+'?id='+Pokemon_ID; }

Answer 4

正如上面的CertainPerformance所提到的，你没有传递正确的参数让你的函数正常工作;使用代码作为参考，您可以将原始事件传递给changeUrl（）函数，然后使用e.target转到'right-btn'元素。

使用Javascript：

application/timestamp-signature

HTML：

var Pokemon_ID = 1;

function changeUrl(e) {
     var href = e.target.getAttribute('href');
     console.log(href +'?id=' + Pokemon_ID);
     return false;
 }

 document.getElementById( 'right-btn' ).onclick = function(e) {
     changeUrl(e);
 };

但是，如果您真的想在函数中使用 this 来引用'right-btn'元素，那么您可以将代码更改为;

使用Javascript：

<div id="right-btn" href="pokedex.php">Click Me 4</div>

更改是事件处理程序中的调用： changeUrl.call（e.target）; ，它会调用您在e.target的“上下文”中运行，在 changeUrl（）中生成 this 元素的功能。然后你就可以在 var href = this.getAttribute（'href'）;

中使用它

通过单击div修改URL

4 个答案: