Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Bruno Conte

Substituir select por radio

Recommended Posts

Pessoal, estou fazendo um serviço onde o usuario digita um texto em um campo text e ele aparece em uma div.

 

Eu tenho um campo select que faz a alteração da fonte do texto.

 

Estou tentando passar esse campo para radio e não esta funcionando, no select funciona no radio não

 

codigo:

<link rel="stylesheet" href="style.css" /><script language='JavaScript'>
function SomenteNumero(e){
var tecla=(window.event)?event.keyCode:e.which;   
if((tecla>47 && tecla<58)) return true;
else{
if (tecla==8 || tecla==0) return true;
else  return false;
}
}
</script>
<body>
<p><span class="col2" style="width:150px; padding-left:7px; padding-right:10px;">
  <textarea name="preenche_texto" rows="2" id="preenche_texto"
            style="height:42px; width:100%" onkeyup="atualiza_texto()"></textarea>
</span></p>
<p><div id="texto"></div>  </p>
</p>
<p>
 <select id="fonte" onChange="altera_fonte(); document.getElementById('descFonte').value=this.value;">
<option value="Arial">Arial</option>
                <option value="Accidental Presidency">Accidental Presidency</option>
</select></p>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<p>
 <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
 <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
      <script>

$(function() {

$( "#texto" ).draggable({
stop: function(){

var left = $('#texto').css('left');
var top = $('#texto').css('top');

$('#final_texto_left').val(left);
$('#final_texto_top').val(top);

}
});

});
</script>
<script type="text/javascript">
var tapete = $('#tapete');


function altera_fonte(){
var select_fonte = $('#fonte').val();
var fonte = select_fonte;

$('#texto').css('font-family', fonte);
$('#final_fonte').val(fonte);
}


function fundo(cor){
//tapete.css('background', 'url("img/' + cor + '.jpg")');
tapete.css('backgroundColor', cor);
$('#final_fundo').val(cor);
}

function texto(cor){
document.getElementById('texto').style.color=cor;
$('#final_texto_cor').val(cor);
}

function nl2br(str, is_xhtml) {
var breakTag = (is_xhtml || typeof is_xhtml === 'undefined') ? '<br />' : '<br>';
return (str + '').replace(/([^>\r\n]?)(\r\n|\n\r|\r|\n)/g, '$1' + breakTag + '$2');
}

function atualiza_texto(){
var input = nl2br($('#preenche_texto').val());
var div = $('#texto');
div.html(input);
$('#final_texto').val(input);
}

function atualiza_tamanho(){
var largura = $('#largura').val();
var altura = $('#altura').val();

$('#tapete_width').val(largura);
$('#tapete_height').val(altura);
tapete.css('height', (500*altura)/largura);
}


function aumenta(){
var texto = $('#texto');
var tamanho_atual = texto.css('font-size');
var novo_tamanho = new Number( tamanho_atual.split('px')[0] ) + 1;

texto.css('font-size', novo_tamanho+'px' );
$('#final_texto_tamanho').val(novo_tamanho);
}


function diminui(){


var texto = $('#texto');


var tamanho_atual = texto.css('font-size');
var novo_tamanho = new Number( tamanho_atual.split('px')[0] ) - 1;

texto.css('font-size', novo_tamanho+'px' );
$('#final_texto_tamanho').val(novo_tamanho);

}

</script>

substituindo o:

<select id="fonte" onChange="altera_fonte(); document.getElementById('descFonte').value=this.value;"><option value="Arial">Arial</option>
                <option value="Accidental Presidency">Accidental Presidency</option>
</select>

por:

<input type="radio" id="fonte" onchange="altera_fonte(); document.getElementById('descFonte').value=this.value;" value="Arial" />    Arial    <input type="radio" id="fonte" onChange="altera_fonte(); document.getElementById('descFonte').value=this.value;" value="Accidental Presidency" />Accidental Presidency

O que devo fazer para fazer funcionar, sou totalmente leigo em javascript e estou apanhando um bucado aqui.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Primeiramente, você deve pesquisar e aprender o funcionamento do radio.

Uma vez entendido isso, ficará fácil de você resolver sua questão, uma vez que o uso dos seus radios estão completamente incorretos, a começar pelo mesmo id nos dois.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Bom dia amigo, em relação ao radio sei como funciona.

essa id coloquei testando, pois no select tem o id mais logico que o id fica no select e não no option.

 

Eu tinha feito sem o id, trocando onChange por onclick já tentei de tudo.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.