Question

这可能很容易，但是当我在文本框外面点击以在javascript中发出警告但是当我在文本内部单击时没有发生任何事情时，我无法想出任何方法。输入文本在div元素内。

所以，让我们假设我的html就像吼叫：

<div id="myone" onclick="javascript: myfunc();">
<input type="text" id="myInput"></input>
</div>

function myfunc()
{
alert('ok');
}

如何改变？

非常感谢你！

Answer 1

这样做：

var div = document.getElementById('myone');
var funct = function(){
    var input = div.querySelector("#myInput");
    return false;
};

div.onclick = funct;

Answer 2

如果你仔细地这样做，这将有效。

<div id="myone" onclick="javascript: myfunc();">
//your stuff in the clickable division.
</div>

<div style="position:absolute;">
<!--Adjust this division in such a way that, it comes inside your clickable division--><input     
type="text" id="myInput"></input>
</div>



//Your script function/code here
function myfunc()
{
alert('ok');
}

Answer 3

你应该使用这个条件。 e.target !== this

将event.target与此进行比较通常很有用，以确定是否由于事件冒泡而处理事件。当事件冒泡时，此属性在事件委派中非常有用。

在这样的点击功能中使用它并查看它的实际效果：

＆＃13;

$('.divover').on('click', function(e) {
  if (e.target !== this) return;
  thefunc();
});


var thefunc = function myfunc() {
  alert('ok');
}

＆＃13;

.divover {
  padding: 20px;
  background: yellow;
}
span {
  background: blue;
  color: white;
  padding: 8px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='divover'>somelabel:
  <span><input type="text"  class="as" name="forename"></span>
</div>

＆＃13;

如何在div内的输入元素外面点击？

3 个答案: