Recuperando texto selecionado
Este artigo demonstra como recuperar o texto selecionado em uma página web o que é muito importante quando é preciso gerar Links dinâmicos, o artigo será dividido em duas partes;
Parte 1: Usaremos Javascript, onde criaremos a função que recupera o texto selecionado;
Parte 2: Usaremos a interface de uma página asp.net, para disparar o método javascript e exibir o texto selecionado.
Criar o Projeto para teste
Primeiro vamos abrir o visual studio e criar um projeto web para desenvolver nossa aplicação teste como demonstrado na figura 1.
Figura 01. Criar o projeto.
Depois de criar abriremos a página Default.aspx no modo source do design para adicionarmos a função javascript abaixo.
Parte 1 – Criar a função “copiarSelecao” ;
<SCRIPT language="JavaScript">
function copiarSelecao() {
var TextoSelecionado = document.selection;
if (TextoSelecionado.type == 'Text') {
var newRange = TextoSelecionado.createRange();
document.form1.txtSelecionado.value = newRange.text;
} else {
alert('Selecione o texto');
}
}
</script>
Depois de criar a função “copiarSelecao”, adicionaremos o seguinte código HTML, para criar a interface que nos ajudará a testar nossa função;
<table width=60% height=60% align=center border=2>
<tr>
<td align=center valign=top width=40% >
<br />
<asp:Label ID=lblTexto runat=server BackColor="White" Font-Bold="True" ForeColor="Red">SELECIONE O TEXTO</asp:Label>
<br />
<br />
<asp:TextBox ID="txtTexto" runat=server Width="536px">O TEXTO SELECIONADO SERÁ CARREGADO NO LABEL</asp:TextBox>
<br />
<asp:Label ID=Label1 runat=server BackColor="White" Font-Bold="True" ForeColor="Red">TEXTO SELECIONADO</asp:Label><br />
<br />
<asp:Label ID=lblTextoSelecionado runat=server Width="536px" Font-Bold="True" ForeColor="Blue"></asp:Label>
<br />
<br />
<asp:Button ID="btnExecutar" runat="server" Text="Recuperar Seleção do Texto" /></td>
</tr>
<input id="txtSelecionado" type="hidden" name="txtSelecionado" runat="server">
</table>
Parte 2 – Criar a chamada da função “copiarSelecao” no código C# onde faremos a adicionaremos um atributo ao botão “btnExecutar” que vai disparar o método criado anteriormente.
using System;
using System.Web.UI.HtmlControls;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
try
{
if (!IsPostBack)
{
btnExecutar.Attributes.Add("OnClick", "copiarSelecao()");
}
lblTextoSelecionado.Text = txtSelecionado.Value;
}
catch (Exception ex)
{
throw ex;
}
}
}
A figura 2, demonstra o resultado do nossa aplicação;
Figura 02. Resultado.
Como vimos, a aplicação é bastante simples. Depois disso é só usar a imaginação para criar novas implementações.
Um grande abraço e até a próxima...
Humberto Lins.
