html5 끌어서 놓기 div 같은 ID를 가진

제목은 꽤 자명하다 생각합니다. 데이터베이스에서 제품을 가져 오는 PHP 코드에서 많은 div가 생성되었습니다. 문제는 두 컨테이너 (div도 가능) 사이에서 드래그 할 때입니다. 제품 ID가 동일하고 컨테이너 1 -> 2 및 거꾸로 돌아 가지 않기 때문에 첫 번째 컨테이너로 모두 되돌릴 수 없습니다. contaner 2 -> 1. (컨테이너 2 개가 있고 모든 제품 div는 동일한 ID를 가짐). 나는 제품의 divs id에 +1을 추가하여이를 해결할 수있다 (그래서 그들은 다른 id를 가짐). 그러나 그 방법으로 나는 css에서 id를 사용할 수 없다. 어떤 해결책? 여기 JS 코드를 사전html5 끌어서 놓기 div 같은 ID를 가진

출처

2012-05-13 BlitzCrank

나는 당신의 문제가 무엇인지 완전히 명확하지 않습니까? CSS에 'id'가 필요한 이유는 무엇입니까? 제품에 ID로 사용할 수있는 고유 한 제품 번호가 없습니까? 질문에 마크 업 스 니펫을 포함하면 도움이 될 수 있습니까? (그게 전부는 아니며, 우리가 어떻게 보이는지 알기에 충분합니다.) – robertc

대신 데이터 속성을 사용할 수 있습니까? – Greg

나는 php에 의해 생성 된 div에 대해 증가 된 ID를 사용하여이를 해결했습니다. 어떻게 그쪽으로 내가 원하는 솔루션 중 하나가 아니 었어. 도움을 주셔서 감사합니다

출처

2012-05-14 17:49:06 BlitzCrank

에서

<script type="text/javascript"> 
      function allowDrop(ev){ 
       ev.preventDefault(); 
       } 
      function drag(ev){ 
       ev.dataTransfer.setData("Text",ev.target.id); 
       } 
      function drop(ev){ 
       if (ev.target.id == "container"){ 
       var data=ev.dataTransfer.getData("Text"); 
       ev.target.appendChild(document.getElementById(data)); 
       ev.preventDefault(); 
       }} 
     </script>

덕분에 당신은 동일한 ID를 가진 두 개의 div가있을 수 없습니다입니다. 클래스를 사용해보십시오.

function drop(ev){ 
    if (ev.hasClass('container')) { 
      // do some stuff 
    } 
}

당신은 동적으로 jQuery를 .addclass() 방법으로 클래스를 추가 할 수 있습니다

귀하의 drop() 기능은 다음과 같이해야한다.

출처

2012-05-13 10:44:51 Simone

Uncaught TypeError : Object # hasClass가 없습니다. jquerry를 사용하지 않는 방법으로, 순수한 js – BlitzCrank

if (ev.target.className.match (/ \ productDiv \ b /)) { this 작동하지만 여전히 동일한 행동 – BlitzCrank

HTML이 유효하려면 ID가 고유해야합니다. ID를 복제하면 이상한 일이 일어납니다. 한 브라우저에서 작동하도록 관리하더라도 다른 사람들은 다르게 처리 할 수 있습니다. 대신 클래스를 사용해 볼 수 있습니다.

출처

2012-05-13 10:46:59

html5 끌어서 놓기 div 같은 ID를 가진

답변

관련 문제