jQuery Replace Page Title from User Input

Question

I am trying to replace the page title from a text area, when the 'Go' button is pressed with jQuery. I have yet to be successful. I have tryed replaceWith(), but that didn't work so I tried this:

test.html:

<html>
<head>
<title>Test</title
<script src="jQuery.min.js"></script>
<script src="go.js"></script>
<link id="si" rel="shortcut icon" media="all" type="image/x-icon" href="http://www.google.com/favicon.ico" />
<!-- This was for trying to change the icon (also unsuccessful) -->
<link id="i" rel="icon" media="all" type="image/vnd.microsoft.icon" href="http://www.google.com/favicon.ico" />
</head>
<body>
<textarea id="title">Type the new title.>;/textarea>
<!-- Put the favicon switcher here -->
<button onclick="go()">Go</button>
<br />
</body>
</html>`

go.js:

$(function go() {
    var title = document.getElementById('title').value();
    document.title = title;
});

Next time you can simply use four (4) spaces for code blocks and multiply (2+) spaces at the end of the line for linebreak. — Andreas Louv, May 11 '13 at 23:56
How About using Google? With a Simple Good Search this is What I found: http://stackoverflow.com/questions/987967/how-to-change-an-elements-title-attribute-using-jquery — Schoening, May 12 '13 at 00:02
I'm looking for solution that can also work for updating the favicon. — John Smith, May 12 '13 at 00:17

Tobi · Answer 1 · 2013-05-12T03:06:06.013

0

Use this go function:

function go() {
    var title = $('#title').val();
    $('title').text(title);
};

edited May 12 '13 at 03:06

answered May 11 '13 at 23:59

Tobi

2,001
2
27
49

This does not change on clicking. – John Smith May 12 '13 at 00:08
Sorry, edited it...the function was wrongly executed on document-ready – Tobi May 12 '13 at 03:07

score 0 · Accepted Answer · answered May 12 '13 at 00:00

0

Without jQuery:

<html>
    <head>
        <title></title>
    </head>
    <body>
        <input type="text" onkeyup="updateTitle()" id="tinput">
        <script>
            var title = document.getElementsByTagName('title');
            title = title[0];

            var titleInput = document.getElementById('tinput');

            function updateTitle() {
                title.innerHTML = titleInput.value;
            }
        </script>
    </body>
</html>

EDIT:

Oh, you are looking for jQuery solution. I'll just keep the answer, maybe somebody else will have use of it :)

answered May 12 '13 at 00:00

Thanks! This is useful, though a jQuery solution would be nice, so I could also use it to change the favicon. – John Smith May 12 '13 at 00:12
No one else seems to be posting, and this way works the best (though a few of the others work too), so I am marking it as the answer. – John Smith May 12 '13 at 00:22

score 0 · Answer 3 · answered May 12 '13 at 00:05

0

$(function() {
   $("button#go").click(function() {
     document.title = $("#title").val();
   });
});

<button id="go">Go</button>

answered May 12 '13 at 00:05

Okan Kocyigit

13,203
18
70
129

score 0 · Answer 4 · answered May 12 '13 at 00:10

0

You can try this as well:

go = function () {
    var title = document.getElementById("title").value;
    alert(title);
    document.title = title;
}

answered May 12 '13 at 00:10

Popo

2,402
5
33
55

jQuery Replace Page Title from User Input

4 Answers4