굵게 단락 후 클릭

-2

<div id="box"> 
<p class="b">item 1</p> 
<p class="b">item 2</p> 
<p class="b">item 3</p> 
<p class="b">item 4</p> 
<p class="b">item 5</p> 
</div>

클릭 한 후 선택한 단락을 굵게 표시하는 방법은 무엇입니까? 내가 '항목이'만 항목을 클릭하면 내가굵게 단락 후 클릭

출처

2013-03-04 user1761325

[무엇을 시도 했습니까?] (http://www.whathaveyoutried.com/) [ask advice] (http://stackoverflow.com/questions/ask-advice)를 참조하십시오. –

"item 2"가 링크가 아닌 경우 "item2"를 클릭하십시오. 다음 유일한 해결책은 JS, 그렇지 않으면 CSS는 당신을 위해 일을 할 것입니다 – Mark

나는 CSS를 사용하여 시도했다. #box p.static : active { \t 글꼴 크기 : 800; } 지정된 단락은 굵게 표시되지만 잠시 동안 만, 단락을 클릭 한 후 영구적으로 표시됩니다. – user1761325

을 클릭 한 후 예를 들어, 2 굵게 나는 좋을 것됩니다

function makeBold(el) { 
    el.style.fontWeight = 'bold'; 
} 

var paragraphs = document.getElementsByTagName('p'); 

for (var i = 0, len = paragraphs.length; i<len; i++){ 
    paragraphs[i].onclick = function(){ 
     makeBold(this); 
    }; 
}

JS Fiddle demo합니다.

또는, 당신은 글꼴 무게 전환 않으려면 :

function toggleBold(el) { 
    el.style.fontWeight = el.style.fontWeight == 'bold' ? 'normal' : 'bold'; 
} 

var paragraphs = document.getElementsByTagName('p'); 

for (var i = 0, len = paragraphs.length; i<len; i++){ 
    paragraphs[i].onclick = function(){ 
     toggleBold(this); 
    }; 
}

JS Fiddle demo합니다.

function toggleBold(el) { 
    var siblings = el.parentNode.getElementsByTagName('p'); 
    for (var i = 0, len = siblings.length; i<len; i++){ 
     if (siblings[i] == el){ 
      el.style.fontWeight = el.style.fontWeight == 'bold' ? 'normal' : 'bold'; 
     } 
     else { 
      siblings[i].style.fontWeight = 'normal'; 
     } 
    } 
} 

var paragraphs = document.getElementsByTagName('p'); 

for (var i = 0, len = paragraphs.length; i<len; i++){ 
    paragraphs[i].onclick = function(){ 
     toggleBold(this); 
    }; 
}

JS Fiddle demo : 당신이 굵은 텍스트 만 하나 단락을 가지고 않으려면

또는, (두 번째 단락 반환이 아닌 굵은 상태로 다른 p 요소를 클릭).

출처

2013-03-04 14:48:11

나는 그것을 시도했다. 그것은 JS 피들에서 일했습니다. 하지만 크롬은 아닙니다. – user1761325

Chrome에서 작동합니다.이 답변을 작성한 브라우저입니다. 페이지 하단에 ''태그가 닫히기 전에'script' 요소를 배치 했습니까? JavaScript가 실행되는 시점에 DOM이 있습니까? –

세 번째 솔루션은 분명 내가 원했던 것입니다. 그러나 여전히 크롬에서는 작동하지 않습니다.을 닫기 전에

이 시도 :

HTML :

<p class="b" onclick="GetBold(this)">item 2</p>

자바 스크립트 : jQuery로

function GetBold(current) 
{ 
    var array = document.getElementsByClassName('p'); 

    for (var i = 0; i < array.length; i++) 
    { 
     array[i].style.fontWeight = 'normal'; 
    } 

    current.style.fontWeight = 'bold'; 
}

출처

2013-03-04 14:56:58 jameson

인라인 JavaScript를 제안하지 마십시오. 그것은 작동합니다, 그렇습니다. 그러나 마크 업과 끔찍한 방해에 빠져서 한 두 가지 이상의 기능을 실행하면 유지 보수가 필요합니다. 정말 고통스러워 할 가치가 없습니다 (이것은 다운 투표보다는 조언 일뿐입니다). –

$('.b').click(function(){ 
    $(this).css({'font-weight':'bold'}) 
})

출처

2013-03-04 15:25:42

굵게 단락 후 클릭

답변

관련 문제