Histórico da Página

<div id="keyWordContainerDiv"></div>


<style>
	.Keyword-Container-Wrapper{
		width: 100%;
		height: auto;
		min-height: 30px;
	}


	.Keyword-Container-Wrapper-Span{
		padding: 5px;
		background-color: #3572b0;
		color: #fff;
	}
</style>


<script>


TOTVS_Keywords = {
	Id: 'KeyWord1',
	Container: null,
	Init: function(id, nameOfContainer){
		this.Id = id;
		this.Container = nameOfContainer;
	},
	Build: function(id, nameOfContainer){
			this.Init(id, nameOfContainer);


			this.Container = (typeof this.Container === "string") ? document.getElementById(this.Container) : this.Container; 


			var _keyWordContainerWrapper = document.createElement('div');		
			_keyWordContainerWrapper.id = this.Id + "_ContainerWrapper";
			_keyWordContainerWrapper.className = "Keyword-Container-Wrapper";
			_keyWordContainerWrapper.contentEditable = true;
			_keyWordContainerWrapper.onkeypress = function(e){
				var _evt = e || window.event;
				
				var keywords = this.innerHTML.replace(/<span[^>]*>|<\/span>/gi).split(' ');

				if(keywords.length > 0)
				{
					for(var i = 0; i < keywords.length; i++){
						var _span = document.createElement('span'); 
						_span.id = this.id + "_" + (i+1) + _span;
						_span.name = _span.id;
						_span.className = 'Keyword-Container-Wrapper-Span';


						this.appendChild(_span);
					}
				}
			}


			this.Container.appendChild(_keyWordContainerWrapper);
	}
}


TOTVS_Keywords.Build('TOTVS_KeyWord', 'keyWordContainerDiv')


</script>