2013-08-28 28 views
0

這是我的代碼:如何在html中替換doctype?

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>jQuery Checkbox and Radio Button Styling</title> 

<style type="text/css"> 

/* 
* customRadioCheck: jQuery plugin for checkbox and radio replacement 
* Usage: $('input[type=checkbox], input[type=radio]').customRadioCheck(); 
* Author: Cedric Ruiz 
* License: MIT 
*/ 
.custom-label { 
    display: inline-block; 
    margin-right: .8em; 
    cursor: pointer; 
} 
.custom-radio, 
.custom-check { 
    vertical-align: middle; 
    display: inline-block; 
    position: relative; 
    top: -.15em; /* Adjust to for best fit */ 
    margin: 0 .4em; 
    width: 20px; 
    height: 20px; 
    background: url(img/customRadioCheck.png) 0 0 no-repeat; 
} 
.custom-radio { background-position: 0 -20px; } 
.custom-check.focus { background-position: -20px 0; } 
.custom-radio.focus { background-position: -20px -20px; } 
.custom-check.checked { background-position: -40px 0; } 
.custom-radio.checked { background-position: -40px -20px; } 
.custom-check.checked.focus { background-position: -60px 0; } 
.custom-radio.checked.focus { background-position: -60px -20px; } 
</style> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
<script type="text/javascript"> 
/* 
* customRadioCheck: jQuery plguin for checkbox and radio replacement 
* Usage: $('input[type=checkbox], input[type=radio]').customRadioCheck(); 
* Author: Cedric Ruiz 
* License: MIT 
*/ 
;(function(){ 
$.fn.customRadioCheck = function() { 

    return this.each(function() { 

    var $this = $(this); 
    var $span = $('<span/>'); 

    $span.addClass('custom-'+ ($this.is(':checkbox') ? 'check' : 'radio')); 
    $this.is(':checked') && $span.addClass('checked'); // init 
    $span.insertAfter($this); 

    $this.parent('label').addClass('custom-label') 
     .attr('onclick', ''); // Fix clicking label in iOS 
    // hide by shifting left 
    $this.css({ position: 'absolute', left: '-9999px' }); 

    // Events 
    $this.on({ 
     change: function() { 
     if ($this.is(':radio')) { 
      $this.parent().siblings('label') 
      .find('.custom-radio').removeClass('checked'); 
     } 
     $span.toggleClass('checked', $this.is(':checked')); 
     }, 
     focus: function() { $span.addClass('focus'); }, 
     blur: function() { $span.removeClass('focus'); } 
    }); 
    }); 
}; 
}()); 
</script> 
</head> 
<body> 

<a href='http://1stwebmagazine.com/jquery-checkbox-and-radio-button-styling'><img src='../img/logo.png' alt='1stWebMagazine' /></a> 
<h1>jQuery Checkbox and Radio Button Styling</h1> 

    <div> 
    <h3>Checkbox:</h3> 
    <label><input type="checkbox"/>sfdf</label><br/> 
    <label><input type="checkbox"/>Lamb</label><br/> 
    <label><input type="checkbox"/>Tiger</label><br/> 
    </div> 
    <div> 
    <h3>Radio button:</h3> 
    <label><input type="radio" name="n"/>Green</label><br/> 
    <label><input type="radio" name="n"/>Blue</label><br/> 
    <label><input type="radio" name="n"/>Orange</label><br/> 
    </div> 


<script type="text/javascript"> 
    $('input[type=checkbox], input[type=radio]').customRadioCheck(); 
</script> 

</body> 
</html> 

在我使用自定義CSS複選框上面的代碼,但在我的jsp我不能使用標籤

<!doctype html> 

那麼,有沒有任何替代<!doctype html>,因爲上面的代碼不工作沒有它

+0

很高興看到您參與評論和其他問題,直到您的問題得到解決。 –

回答

0

我會創建3個頁面,一個HTML,CSS和JSP並將它們鏈接在一起。

3

您仍然可以從JSP聲明HTML5文檔類型:

<![CDATA[<!DOCTYPE html>]]> 
1

這裏是沒有辦法得到DOCTYPE HTML一樣物體。你可以這樣做

document.write("<!doctype HTML>\n" + document.head.outerHTML + document.body.outerHTML); 

使用新的文檔類型並替換完整的html源代碼。