Minimal Setup

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="./tagarea.js"></script>
<script type="text/javascript">
	$(function(){
		$('#country').tagarea({
			taglist_url: './country.php'
		});

		$('#animal').tagarea();
	});
</script>

<div id="country" class="tagareabox">
	<div class="pre-tag">["United States", "United Kingdom", "Japan"]</div>
</div>

<div id="animal" class="tagareabox">
	<div class="pre-tag">["elefant"]</div>
	<div class="pre-list">["panda","giraff","elefant", ... ,"zebra"]</div>
</div>
			

Main Options

function(tag_name){
	console.log('add', tag_name);
}

function(tag_name){
	console.log('remove', tag_name);
}

function(tag_name){
	console.log('change', tag_name);
}

Main Methods

var tagareaObj = $('#animal').tagarea();
tagareaObj.execute('lion');

var tagareaObj = $('#animal').tagarea();
tagareaObj.inTagbox('lion');

var tagareaObj = $('#animal').tagarea();
tagareaObj.inTaglist('lion');