Используйте addClass в jQuery для вызова класса CSS, написанного в другом файле - PullRequest
Новая
       22

Используйте addClass в jQuery для вызова класса CSS, написанного в другом файле

3 голосов
/ 11 декабря 2011

Я хочу вызвать класс CSS, написанный в файле CSS, из функции JQuery (тоже внешний файл).

Это не работает. Интересно, почему:

JQuery: 

/// <reference path="jquery-1.7.1.js" />
/// <reference path="jquery-1.7.1-vsdoc.js" />
/// <reference path="main_style.css" />
    function gg() {
        alert("zombie");
        $("p").addClass("blood");
    };

CSS: 

.blood
{
    color: Aqua;
    background-color: Red;
    border: 2;
    font-weight: bold;
}

Я добавил ссылку на файл CSS в файл jQuery, и я не понимаю, почему он не находит его и не меняет все абзацы.

Но функция "gg" достигнута, потому что я вижу предупреждение зомби.

HTML: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="Scripts/jquery-1.7.1.js" type="text/javascript"></script>
<script src="Scripts/jquery-1.7.1-vsdoc.js" type="text/javascript"></script>
<link href="Scripts/main_style.css" rel="stylesheet" type="text/css" />
<script src="Scripts/mon_script.js" type="text/javascript"></script>


<title></title>
</head>
<body>
<div>
<p>This is the first paragraph</p>
<p id="4">This is the second paragraph</p>
<p>This is the third paragraph</p>
<p class="blood">This is the fourth paragraph</p>
<input type = "button" value="Hi" onclick="gg()" />

</div>
</body>
</html>

Ответы [ 2 ]

3 голосов
/ 11 декабря 2011

Вам необходимо добавить ссылку на таблицу стилей main_style.css в html-документе (то есть в aspx-файле в ASP.NET), который включает ваш скрипт jquery. Указанный вами ссылочный путь предназначен только для поддержки IntelliSense.

Ссылка на таблицу стилей в вашем HTML-файле будет выглядеть так, если и CSS-файл, и HTML-файл находятся в одной и той же относительной позиции (в противном случае используйте относительный путь к CSS-файлу): 

<LINK href="main_style.css" rel="stylesheet" type="text/css">
0 голосов
/ 11 декабря 2011

Линия: 

/// <reference path="main_style.css" />

... для Intellisense в Visual Studio. Он не добавляет ссылку на файл CSS, который может видеть ваш файл HTML.

Вам необходимо добавить это в ваш html <head> раздел: 

<link rel="stylesheet" href="main_style.css" />

Я создал рабочий образец из вашего последнего обновления:

Демо: http://jsfiddle.net/ThinkingStiff/u39XR/

Работа оттуда.

...