[Bind.htm]



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title>bind() 메서드로 동적으로 이벤트 부여</title>

    <script src="js/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(document).ready(

            function() {

                $('#btnClick').bind("click", function() { alert('클릭됨'); });                

                $('#btnClick').bind("mouseover", function() {

                document.getElementById('btnClick').style.backgroundColor = 'red';

                });                   

                $('#btnClick').bind("mouseout", function() {

                    $('#btnClick').get(0).style.backgroundColor = '';

                });

            });

    </script>

</head>

<body>

 

<div id="btnClick">

    클릭하세요!!!

</div>

 

</body>

</html>

 




-------------------------------------------------------------------------------------




[실행결과]


--> '클릭하세요!!!'텍스트에 마우스 오버(mouseover)시...




--> '클릭하세요!!!'텍스트에서 마우스 아웃(mouseout)시...




--> '클릭하세요!!!'텍스트에 마우스 클릭(click)시...




















Posted by holland14
: