Does not return the string

0

I have a input where I'll put the word

  

'Party:'

function go() {
  var c = document.getElementById("mm");
  var part = "Party: ";
  var partC = part.fontcolor("black");
  var f = c.value = partC;
}
<input type="button" id="goes" onclick="go()">
<input type="text" id="mm">

The problem is that I see the structure of the font and not just the string, what is the problem?

Edit: Yes I do

  

var f = c.value = part;

It will come out

  

'party'

, but without the color changed.

SECOND EDITION: I do not want to apply the whole value to only the string, this is the complete code:

$(document).ready(function(){
    $('#gParty').on("click", function(){
        var c = document.getElementById("partyCode");
        var part = "Party: ";
        var partC = part.fontcolor("black");
        var d = c.value = partC+selectedServer;
        var e = c.style.textAlign = 'center';
        var f = c.style.color = "red";
        var p = c.style.fontFamily = "Ubuntu";
        var i = c.style.fontSize = "larger";
        console.log(c);



    }
    
asked by Eduardo Sebastian 10.05.2017 в 17:14
source

1 answer

6

Setting .style.color for the color modifies the property css of the element. Color is the color of the font.

Y .value for the attribute value of input

Note: I put red so you can see the change

According to the new edition:

You can not put a chunk of input type text in one way and another chunk in another

For that use a div with contentEditable="true" to write as if it were an input.

I put a check so if you already have that font , do not add more. And so if you wrote something, I put it in front of that text.

function go() {
  var c = document.getElementById("mm");
  var part = "Party: ";
  var partC = "red"; //"black"

  var text = c.innerHTML;
  if (!text.includes("font")) {
    c.innerHTML = "<font  color='" + partC + "'>" + part + "</font> Otro texto en negro " + text;
  }
}
#mm {
  width: 500px;
  height: 10px;
  border: 1px solid #ccc;
  padding: 5px;
}
<input type="button" id="goes" onclick="go()">
<div id="mm" contenteditable="true"></div>
    
answered by 10.05.2017 в 17:19