클릭 버튼을 누르면 셔플 기능

페이지를 새로 고칠 때마다 단어가 임의로 재생됩니다. 예를 들어 "# 네 이름을 안다해도 될까?" 그것은 "당신의 이름을 알기"위해 뒤섞입니다. 나는 "#"당신의 이름을 알고 있겠는가? "와 같이 정확한 문장을 인쇄 해주기 바란다. SHUFFLE 버튼을 클릭하면 셔플됩니다.클릭 버튼을 누르면 셔플 기능

HTML :

<body> 
     <div id="cardContainer" draggable="true"></div> 
<style> 
     .box { 
      width:200px; 
      height:20px; 
      padding:10px; 
      border:1px solid #aaaaaa; 
      display: inline-block; 
     } 
     .mover{ 
      color:red; 
      background-color: yellow; 
      width:auto ; 
      font-size: 30px ; 
      border: 2px; 
     } 
     #id1 { 
     color:black; 
     background-color: #2BFFB6; 
     width:150px ; 
     font-size: 40px ; 
     border: 1px; 
     display: inline; 
     margin: 20px; 
    } 
    #id2 { 
     color:black; 
     background-color: #2BFFB6; 
     width:150px ; 
     font-size: 40px ; 
     border: 1px; 
     display: inline; 
     margin: 20px; 
    } 
    #id3 { 
     color:black; 
     background-color: #2BFFB6; 
     width:150px ; 
     font-size: 40px ; 
     border: 1px; 
     display: inline; 
     margin: 20px; 
    } 
    #id4 { 
     color:black; 
     background-color: #2BFFB6; 
     width:150px ; 
     font-size: 40px ; 
     border: 1px; 
     display: inline; 
     margin: 20px; 
    } 
    #id5 { 
     color:black; 
     background-color: #2BFFB6; 
     width:150px ; 
     font-size: 40px ; 
     border: 1px; 
     display: inline; 
     margin: 20px; 
} 
#id6 { 
     color:black; 
     background-color: #2BFFB6; 
     width:150px ; 
     font-size: 40px ; 
     border:1px; 
     display: inline; 
     margin: 20px; 
}

<div id>Is this draggable and droppable?</div> 
</body> 
<head> 
    <?php 
    $conn = mysql_connect("localhost", "root", "password"); 

    if (!mysql_select_db("login")) { 
     echo "Unable to select go database " . mysql_error(); 
     exit; 
    } 
    $sql = "SELECT table 
    FROM se 
    WHERE id = 1"; 

    $result = mysql_query($sql); 

    while ($row = mysql_fetch_assoc($result)) { 
     $output = $row["full"]; 
    } 
    mysql_free_result($result); 
    ?> 
    <script> 
     var js_var = "<?php echo $output ?>"; 
     var div_id = ['id1','id2','id3','id4','id5','id6','id7','id8','id9','id10']; 
     var box_id = ['box1','box2','box3','box4','box5','box6','box7','box8','box9','box10']; 
    var original=js_var.split("#"); 
    var balls90= js_var.split("#"); 

    function getNumbers() { 
     var player1 = new Array(); 
     balls90.sort(function() { 
     return Math.random() - .25; 
    }); 

    for (var i = 0; i < balls90.length; i++) { 
     document.writeln('<div id="+box_id[i]+" class="box" droppable="true" ondrop="drop(event)"   
     ondragover="allowDrop(event)"></div>'); 
    } 

    for (var i = 0; i < balls90.length; i++) { 
     player1.push(balls90[i]); 
    } 

    } 

    getNumbers(); 

    function dragWord(dragEvent){ 
     dragEvent.dataTransfer.setData("text/html",   
     dragEvent.target.textContent+"|"+dragEvent.target.parentNode.id); 
    } 


    function dropWord(dropEvent){ 
     var dropData = dropEvent.dataTransfer.getData("text/html"); 
     var dropItems = dropData.split("|"); 
     var prevElem = document.getElementById(dropItems[1]); 
     prevElem.getElementsByTagName("div")[0].textContent = dropEvent.target.textContent; 
     dropEvent.target.textContent = dropItems[0]; 
     dropEvent.preventDefault(); 
    } 

    function allowDrop(ev) { 
     ev.preventDefault(); 
    } 


    function drag(ev) { 
     ev.dataTransfer.setData("Text", ev.target.id); 
    } 

    function drop(ev) { 
     ev.preventDefault(); 
     var data = ev.dataTransfer.getData("Text"); 
     ev.target.appendChild(document.getElementById(data)); 
    //var data_content=document.getElementById(data).innerText; 
    //alert('The selected text is: ' + data_content + '.'); 
    } 

    </script> 
     <button id="shuffle" type="button">SHUFFLE</button> 
    </head>

출처

2014-07-25 user3773928

희망이 당신을 도울 것입니다 :

var textDiv = document.getElementById('text'); 
document.getElementById('shuffle').addEventListener('click',function(){ 
    var words = textDiv.innerText.split(' '); 
    var len = words.length; 
    var result = ''; 
    textDiv.innerText = ''; 
    for(var i = 0; i < len; ++i){ 
     var randIndex = Math.floor((Math.random() * (words.length))); 
     result += words[randIndex] + ' '; 
     words.splice(randIndex, 1); 
    } 
    textDiv.innerText = result; 
}, false);

jsfiddle : http://jsfiddle.net/weeklyTea/48gqa/

출처

2014-07-25 04:54:34 weeklyTea

내 데이터베이스의 문장을 검색 할 수 있습니다. 나는 정확한 문장을 먼저 보여줄 필요가있다. 셔플 버튼을 클릭하면 문장이 뒤섞 일 것이다. 그리고 내가 가지고있는 코드는 html 파일에 문장이 없다는 것입니다. shuffle은 JavaScript로 작성된 문장입니다. 현재, 현재 나타나는 것은 데이터베이스가 이미 섞여있는 문장입니다. – user3773928

그래서 이미 데이터베이스에서 js_var 변수로 shuffled 문장을 받고 올바른 순서로 문장에 단어를 설정하고 싶습니까? 이 경우 올바른 주문 정보를 데이터베이스에서 받아야합니다. 예를 들어, 다음과 같이 문장 안에 일련 번호를 가진 단어를 넣을 수 있습니다 :'var sentence = { 'this': 1, 'expample': 3 'is': 2}' – weeklyTea

<script> 
window.onload=function() 
{ 
    var txt=document.getElementById("maintext").innerHTML; 
    document.getElementById("btn").addEventListener("click",function(){ 
     var splittxt=txt.split(" "); 
     splittxt.sort(function(){ 
      return Math.round(Math.random()); 
     }); 
     document.getElementById("maintext").innerHTML=splittxt.join(" ");  
    },false); 
} 
</script>

출처

2014-07-25 07:30:10

답변

관련 문제