El mejor tutorial de jQuery EasyUI Disposición - añadir dinámicamente pestañas (Tabs) en 2024. En este tutorial podrás aprender Descargar ejemplos de jQuery EasyUI,

jQuery EasyUI Disposición - añadir dinámicamente pestañas (Tabs)

Las pestañas pueden ser fácilmente añadidos mediante el uso de jQuery EasyUI. Sólo tiene que llamar al método 'Añadir' puede ser.

En este tutorial, vamos a utilizar iframe dinámicamente agregar aquí para mostrar en una página. Al hacer clic en el botón Añadir, se añadirá una nueva pestaña. Si la ficha ya existe, éste se activará.

Paso 1: Crear aquí

	<Div style = "margin-bottom: 10px">
		<a href="#" class="easyui-linkbutton" onclick="addTab('google','http://www.google.com')"> google </a>
		<a href="#" class="easyui-linkbutton" onclick="addTab('jquery','http://jquery.com/')"> jQuery </a>
		<a href="#" class="easyui-linkbutton" onclick="addTab('easyui','http://jeasyui.com/')"> easyui </a>
	</ Div>
	<Id = clase "tt" Div = estilo "-pestañas easyui" = "width: 400px; altura: 250px;">
		<Title = Div "Inicio">
		</ Div>
	</ Div>

El código HTML es muy simple, creamos el panel de aquí con una pestaña llamada de 'Inicio'. Tenga en cuenta que no es necesario escribir ningún código js.

Paso 2: Implementar la función 'addTab'

	función addTab (título, url) {
		if ($ ( '# tt'). pestañas ( 'existe', título)) {
			$ Pestañas ( '# Tt') ( 'select', título) .;
		} Else {
			contenido var = '<iframe frameborder scrolling = "auto" = "0" src = "' + url + '" style = "width: 100%; altura: 100%;"> </ iframe>';
			$ ( '# Tt'). Aquí (en 'Añadir', {
				Título: título,
				contenido: contenido,
				que se puede cerrar: true
			});
		}
	}

Utilizamos el método 'existe' para determinar si la ficha ya existe, si es que existe pestaña activa. Si no hay ninguna llamada al método "Añadir" para añadir un nuevo panel de pestañas.

Descargar ejemplos de jQuery EasyUI

jeasyui-layout-tabs2.zip

jQuery EasyUI Disposición - añadir dinámicamente pestañas (Tabs)
10/30