Jquery在文本框末尾单击事件

时间:2014-03-14 10:21:21

标签: jquery css textbox background-image

当用户点击文本框末尾最多30px填充权时,是否有机会触发点击事件?我在文本框的末尾有一个背景图片。我有这样的情况,我不能添加背景图标作为div并附加到文本框的右端。

2 个答案:

答案 0 :(得分:1)

试试这个:

var text = document.getElementsByClassName('text')[0];
text.onclick = function(e){
    var el = e.currentTarget;
    var width = el.offsetWidth;
    var x = el.offsetLeft;
    var x1 = e.pageX;
    if(x1 > (x + width - 30)){   // 30 is padding-right value
        alert("hello");
    }
}

Working Fiddle

答案 1 :(得分:0)

<div class="textbox">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut feugiat vitae dui sit amet dignissim. Mauris laoreet ultrices libero. Fusce justo lacus, ultricies et egestas ultrices, ultrices et metus. Aenean at rutrum nibh, imperdiet interdum lectus. Pellentesque in neque luctus, pulvinar dui non, lobortis urna. Nulla imperdiet congue felis quis euismod. Pellentesque tempus ornare porta. Ut sit amet nibh non dui hendrerit placerat at sit amet tellus. Phasellus ut est justo. Interdum et malesuada fames ac ante ipsum primis in faucibus. Aenean sit amet urna quis quam facilisis tempor. Sed ut eleifend risus, in elementum ligula.
</div>

$('.textbox').append('<a href="#">Press me</a>');
$('.textbox a').click(function() {
  alert( "Handler for .click() called." );
});

http://jsfiddle.net/KGy48/