Javascript jQuery.one（）事件处理程序未执行

我正在尝试使用

jQuery.one（）

禁用一个按钮，该按钮在单击树后显示树的图像。

showImage

功能工作正常，但不是

.one

我不能在jquery事件处理程序中使用javascript吗

html:

<div class="grove">
    <button id="plant" onclick="showImage()">Plant Orange Tree</button>
  </div>

  <div id="orange-tree-template">
    <div class="orange-tree">
      <h2>Tree Name</h2>
      <h3>etc...</h3>

.display-tree-big{
  background: url('../images/tree_big.jpg');
  background-repeat: no-repeat;
  height:1000px;
  width:1000px;
  border: solid black 2px;
}

#orange-tree-template { visibility: hidden; }

javascript

function showImage() {
  var img = document.getElementById('orange-tree-template');
  img.style.visibility = 'visible';
}

$(document).ready(function() {
  $("#plant").one( "click", function() {
    document.getElementById("#plant").disabled = true;
  });
});

有几个问题

为按钮分配了一个内联onclick处理程序。这将不尊重jQuery.one方法，因此由于错误2，您可以继续单击按钮并调用

showImage

正在调用通过

jQuery.one（）

分配给click事件的函数，但是语句

document.getElementById（“#plant”）

不应包含

，因此该按钮未被禁用

jQuery（函数（$）{
$（“#工厂”）。一个（“点击”，函数（）{
//是的，当然你可以使用JavaScript
document.getElementById（'orange-tree-template'）。style.visibility='visible'；
this.disabled=true；
});
});
#橙色树模板{
可见性：隐藏；
}

种桔树
试验
document.getElementById（“工厂”）
typo？显然，通过showImage函数，您知道
#
不属于那里。如果您打开控制台并查看错误，您将看到它返回null，这将提示您更仔细地查看该语句<代码>未捕获类型错误：无法将属性“disabled”设置为null

Try

$（“#plant”）。在（'click'，function（）{}）上@KevinB，嗯？我错过了什么吗？在和上。考虑到问题在第一次单击时就出现了，在这种情况下，应该执行相同的操作。检查。另外，删除
文档中的“#”。getElementById（“#plant”）。disabled=true。它已经被ID占据了，所以不需要“#”了。可能是因为它和这个问题一样有用（没用？）。@robbmj：非常感谢你花时间回答这个问题——你的回答帮助我解决了一些我花了太多时间的问题。很明显，我是新来的，所以我真的非常感谢你在这方面花更多的时间！