android phonegap數據庫連接

我想使用這個html，並建立一個數據庫連接來添加這些東西。但我真的不知道該用什麼或如何去做。你可以幫我嗎？android phonegap數據庫連接

<html> 
     <head> 
    <title>Ingredient</title> 
     <meta charset="utf-8" /> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <link rel="stylesheet" href="themes/receta.min.css" /> 
     <link rel="stylesheet" href="themes/receta.css" /> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css" /> 
    <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> 
    <script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script> 
     <script src="js/recetas.js"> </script> 

</head> 
<div> 
<h1>RECETA</h1> 
<label for="receta">Nombre Receta:</label><br> 
<input type="text" name="receta" value="" maxlength="20" /><br> 
</div> 
<CENTER> 
<body> 

     <label>Instrucciones</label> 
     <textarea style="width: 300px; height: 150px"> 

    </textarea> 

    <label>Ingredientes</label> 
    <ul style="width: 300px; height: 150px"> 
    <ul> 

    </ul> 

    <select onchange="selectIngredient(this);"> 
    <option value="Cheese">Cheese</option> 
    <option value="Olives">Olives</option> 
    <option value="Pepperoni">Pepperoni</option> 
    <option value="Milk">Milk</option> 
    </select> 

<li style="width: 300px; height: 150px"> 
<button>GUARDAR</button> 
<li><a href="consultas.html" data-transition="none" rel="external">CONSULTAR</a></li> 
</body> 
</center> 
</html>

下面是成分的功能我使用，使在HTML列表：

function selectIngredient(select) 
    { 
     var $ul = $(select).closest('.ui-select').prev('ul'); 
console.log($ul[0]) 
    if ($ul.find('input[value=' + $(select).val() + ']').length == 0) { 
    console.log('s') 
     $ul.append('<li onclick="$(this).remove();">' + 
      '<input type="hidden" name="ingredients[]" value="' + 
      $(select).val() + '" /> ' + 
      $(select).find('option:selected').text() + '</li>'); 
    } 
    }

我可以把圖像，但我需要更多的聲譽，請幫助。

enter image description here