Library/jQeury
jQuery 배우면서 끄적인 코드
청렴결백한 만능 재주꾼
2021. 2. 24. 00:35
반응형
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.5.1.js"></script>
<link rel="stylesheet" href="style.css">
<script type="text/javascript">
$(document).ready(function () {
var result = 'Welecome,';
$('.inputRequired').change(function () {
if(result == 'Welcome,')
{
result = $(this).val();
}
else
{
result += ' '+ $(this).val();
}
$('#divResult').html(result);
});
$('#btnSubmit').on('click',{
firstName: $('#textFirstName').val(),
lastName: $('#textLastName').val()
}, sayHello);
$('ol').on('click', 'li', function() {
$(this).fadeOut(500);
});
$('#btnAdd').on('click', function() {
$('ol').append('<li>@@@@@@@@@@@@@</li>')
});
$('#btn').on({
click: function(){
alert('Button Clicked');
},
mouseover: function() {
$(this).css('background-color', 'yellow');
},
mouseout: function(){
$(this).css('background-color', 'white');
}
})
var jqueryObject = $('#btn');
var rawDOMElement = jqueryObject.get(0);
var eventObject = $._data(rawDOMElement, 'events');
if(eventObject != undefined && eventObject.click != undefined)
{
alert('Click event already exists')
}
else
{
alert('Click event does not exist')
}
function sayHello(event)
{
if(event.data == null)
{
alert('Enter Name please')
}
else {
alert('You must be' + (event.data.firstName!=null ? event.data.firstName + ' ' : '' )+(event.data.lastName!=null ? event.data.lastName : '' ));
}
}
});
</script>
</head> 참고
반응형