如果超过值,则在文本框中显示弹出窗口

时间:2016-03-22 07:37:51

标签: javascript jquery html twitter-bootstrap bootstrap-popover

我是javascript的新手。我不知道javascript,我还在学习。我想要一点帮助 我有一个带号码的标签。用户必须在文本框中手动输入数字。如果用户输入的值超过标签中写入的值,则应在输入框上显示一个弹出窗口 我试着这样做,但无论如何都会显示popover。我希望只有在满足条件时才能显示popover 此外,任何人都可以告诉我如何在弹出窗口内容中包含锚标记和<br>标记?

&#13;
&#13;
$(document).ready(function(){
  var Err2 = $("#max").val();
  $('input').blur(function(){
    if( $(this).val() >= Err2 ) {
      $(this).popover({
        title: 'Warning!',
        content: 'sfgjksfhgjkhdghdfgjkdfjkgdfjkgn <a href=#">fgdfgdg</a>jhksdjhfdfsdgjlk',
        placement: 'bottom'
      }).popover('show');
    } else {
      $(this).popover('destroy');
    }
  })
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
content=<span id="max">5</span>
<input type="text" class="form-control">
&#13;
&#13;
&#13;

http://www.bootply.com/suPp4ThGxq

4 个答案:

答案 0 :(得分:1)

首先,span没有value属性。因此$("#max").val()将返回""

Secound,当你从DOM元素读取值时,它们被读作字符串。如果您使用parseInt()parseFloat()进行检查,则最好。

Updated Code

答案 1 :(得分:1)

只需将var Err2 = $("#max").val();替换为var Err2 = $("#max").text();

即可

对于span,它返回“”表示val()

答案 2 :(得分:0)

使用text()代替val(),如下所示:

var Err2=$("#max").text();

此外,您还必须测试您的字段中是否有数字或文字。

请参阅此帖子以测试字段是否包含数字:Javascript regexp number only check

答案 3 :(得分:0)

只需将脚本替换为下面的脚本,就可以按预期工作。

<script>
$(document).ready(function(){
  var Err2 = $("#max").text();
  $('input').keyup(function(){
    if( $(this).val().length >= Err2 ) {
      $(this).popover({
        title: 'Warning!',
        content: 'sfgjksfhgjkhdghdfgjkdfjkgdfjkgn <a href=#">fgdfgdg</a>jhksdjhfdfsdgjlk',
        placement: 'bottom'
      }).popover('show');
    } else {
      $(this).popover('destroy');
    }
  })
});
</script>