Запись jquery с использованием документа write

-1

Я пытаюсь написать код, который будет вводить данные от пользователя и создать перетаскиваемый для ввода. Я мог писать HTML и CSS с помощью javascript, но когда я пытаюсь сделать то же самое для jquery; это не работает. Где я иду не так?Запись jquery с использованием документа write

<html> 
    <head> 
    <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script> 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>   
    <script> 
     function init() { 
      var op=document.getElementById("inputo").value; 
      document.write("<style>" + "#" + op + "{color:red; height:50px; width:50px; border:1px  solid black ; border-radius:100%; line-height: 50px; }" +"<br>" + "</style>"); 
      document.write("<h1 id=" + op + ">" + op + "</h1>"); 
      document.write("<script>" "<br>"+ " $(document).ready(function() { #op.draggable();});" +"</script>"); 
     } 
    </script> 
    </head> 
    <body> 
     Draggable: 
     <input type="text" id="inputo"/> 
     <input type="button" onClick="init()" value="submit"/> 
    </body> 
</html>

источник

2014-01-29 user3235729

'document.write()' можно назвать только как страница рендеринга изначально, назвав его после загрузки страницы будет перезаписана DOM с 'document.write()' кода. Вы также пытаетесь запустить функцию из JavaScript 'String', которая на 100% не будет работать. Почему это даже внутри строки? Переместите его и вызовите эту функцию. –

Вам нужно загрузить jquery.min.jsПЕРЕДjquery-ui.min.js И * не гнездятся сценарий * s, так что ваш <head> тег должен быть:

<head> 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
    <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script> 

    <script> 
    function init() { 
    /*...SOME STUFF HERE*/ 
    } 
    </script> 
    </head>

источник

2014-01-29 09:01:01 bodi0

вместо document.write, вы можете добавьте тег, подобный этому.

<html> 
<head> 
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> 
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script> 
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script> 
<link rel="stylesheet" href="http://jqueryui.com/jquery-wp- content/themes/jquery/css/base.css?v=1"> 

<script> 
function init() 
{ 
var op=document.getElementById("inputo").value; 

var string = "<h1 class='test' style='color:red; height:50px; width:50px; border:1px solid black ; border-radius:100%; line-height: 50px;'>" + op + "</h1>"; 
$("#container").html(string); 
$(".test").draggable(); 
} 
</script> 
</head> 
<body> 
Draggable: <input type="text" id="inputo"/> 
<input type="button" onClick="init()" value="submit"/> 

<div id="container"></div> 

</body> 
</html>

источник

2014-01-29 09:10:24

Спасибо. Это сработало. – user3235729

Добро пожаловать. U может принять это как ответ тоже –

Запись jquery с использованием документа write

ответ

Смежные вопросы