当文本框指定了“data-role = tagsinput”时,onkeyup事件不起作用

时间:2014-01-30 11:51:08

标签: javascript html twitter-bootstrap

以下是我一直在处理的代码,

    

    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="css/bootstrap-tagsinput.css" rel="stylesheet">

    <script src="js/jquery.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/bootstrap-tagsinput.min.js"></script>

    <script>
    var request;

        function sendInfo(){
            var v=document.main.io.value;
            var url="myjsp.jsp?val="+v;

            if(window.XMLHttpRequest){
                request=new XMLHttpRequest();
            }
            else if(window.ActiveXObject){
            request=new ActiveXObject("Microsoft.XMLHTTP");
            }

            try{
                request.onreadystatechange=getInfo;
                request.open("GET",url,true);
                request.send();
            }catch(e){
                alert("Unable to connect to server");
            }
        }

        function getInfo(){
            if(request.readyState==4){
                var m=request.responseText;
                document.getElementById('sam').innerHTML=m;

            }
        }

    </script>

</head>
<body>
    <form name="main">
        <input type="text" name="io" onkeyup="sendInfo()" data-role="tagsinput"/>
    </form>
    <div id="sam">
    </div>
</body>

我没有收录“myjsp.jsp”文件,因为我确信它没有任何问题。

如果我按如下方式创建文本框,

<input type="text" name="io" onkeyup="sendInfo()"/>

然后调用函数“sendInfo()”但是如果我将“data-role ='tagsinput'”添加为,

  <input type="text" name="io" onkeyup="sendInfo()" data-role="tagsinput"/>

然后不调用函数“sendInfo()”。

我必须编写data-role="tagsinput"来生成引导标记,但我还希望执行函数“ sendInfo()”。 有关这种情况的任何建议?? 提前谢谢。

1 个答案:

答案 0 :(得分:0)

您可以使用javascript添加事件监听器:

window.attachEvent = function(){
    document.querySelector("input[data-role='tagsinput']").onkeyup(function(){
        sendInfo();
    });
};
window.addEventListener("load", attachEvent);

要确保函数的可访问性,请在窗口上下文中定义:

window.sendInfo=function sendInfo(){/.../}

你也可以试试body onload属性:

<body onload="attachEvent();">...</body>