Wednesday, June 2, 2021

Slip 10. Write a jQuery code to make first word of each statement to bold.

 

Slip 10. Write a jQuery code to make first word of each statement to bold. 

<!DOCTYPE html>
<html>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
  
  <body>
    <p>Computer Application</p>
    <p>Autocad</p>
    <p>Data Structure using c</p>
    <p>Software Testing</p>
    <p>Java Programming</p>
  <script>
     $(document).ready(function(){
       $('p').each(function(){  
          var pdata = $(this);  
          pdata.html(pdata.text().replace(/(^\w+)/,'<strong>$1</strong>'));  
        }); 
     });
   </script>
  </body>
 </html>






Tuesday, June 1, 2021

Slip 9. Write a jQuery code to allow the user to enter only 15 characters into the textbox.

 

9. Write a jQuery code to allow the user to enter only 15 characters into the textbox. 

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
  
  <title>Limit character input in the textarea including count</title>
 <style type="text/css">
  textarea {
       display:block;
       margin:1em 0;
 }  
</style>  
 
 <script>
     $(document).ready(function(){
    $('textarea').keyup(function() {
    var maxLength = 15;
    var textlen =  $('textarea').val().length;
    var remtextlen= maxLength-textlen
    $('#remchars').html(remtextlen);
});
});
 </script>
  </head>
 <body>
<form>
<label>Maximum 15 characters</label>
 
  <textarea id="textarea" maxlength="15"></textarea>
  <span id="remchars">15</span> Character(s) Remaining
 </form>
</body>
</html>

// OutPut




Slip 8. Write a jQuery code to print a page

 8. Write a jQuery code to print a page

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
   <title>Print a page using jQuery</title>
<script>
  $('btn.printPage').click(function(){
           window.print();
          return false;
});
 </script>
 <p>Click the button to print the current page.</p>
 <button onclick="window.print()">Print this page</button>
</head>
<body>
</body>
</html>

//Output






Slip 7. Write a jQuery code to create a zebra stripes table effect.

Slip 7 Write a jQuery code to create a zebra stripes table effect. 


<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
 <style type="text/css">.table_style {
width: 500px;
margin: 0px auto;
      }

        table{
   width: 100%;
   border-collapse: collapse;
}

        table tr td{
    width: 50%;
    border: 2px solid 
                     #4d4dff;
    padding: 5px;
}
table tr th{
    border: 2px solid 
                    #4d4dff;
padding: 5px;
}
.zebra{
background-color:  
        #ff0001;
}
</style>
 <script>
 $(document).ready(function(){
$("tr:odd").addClass("zebra");
   });
 </script>
  <title>Create a Zebra Stripes table effect</title>
</head>
<body>
<div class="table_style">
<table>
<tr>
<th>Student Name</th>
<th>Marks in DBMS</th>
</tr>
<tr>
<td>Akshay</td>
<td>85.00</td>
</tr>
<tr>
<td>Sudhir</td>
<td>90.00</td>
</tr>
<tr>
<td>Kirti</td>
<td>75.00</td>
</tr>
<tr>
<td>Manasi</td>
<td>90.00</td>
</tr>
</table>
</div>
</body>
</html>


//Output








Slip 10. Write a jQuery code to make first word of each statement to bold.

  Slip 10. Write a jQuery code to make first word of each statement to bold.  <!DOCTYPE html> <html>   <head>     <scri...