Jump to content
  • 0

onclick в отдельном js-файле.


Bolmazov
 Share

Question

Здравствуйте.

Заранее извинюсь за возможную простоту вопроса, так как JS, XML и XSL Я изучаю лишь месяц. К тому же Я длительное время пытался сам решить эту ?задачку? и поискать решения в Интернете, не нашел.

Итак:

У Меня есть XML файл. Он обрабатывается XSL.

Вот пример фрагмента XML:

?
<document>
<node class='term'><text>1_some data</text></node>
<node class='psevdo'><text> 2_some data </text>
<node class='psevdo'><text>2.1_ some data </text>
<node class='term'><text>2.1.1_ some data </text></node>
</node>
<node class='term'><text> 2.2_some data </text></node>
</node>
<node class='psevdo'><text> 3_some data </text>
<node class='term'><text>3.1_ some data </text></node>
</node>
<node class='term'><text>4_some data </text></node>
</document>

В XLS написан такой фрагмент:

?
<xsl:teamplate match=?node?>
<xsl:choose>
<xsl:when test=?@class=?psevdo??>
<div name=?node? type=?psevdo? class=?psevdo?>
<xsl:value-of select=?text?/>
<xsl:apply-templates select=?node?/>
</div>
</xsl:when>
<xsl:when test=?@class=?term??>
<div name=?node? type=?term?class=?term?>
<xsl:value-of select=?.?/>
<xsl:apply-templates select=?node?/>
</div>
</xsl:when>
</xsl:choose>
</xsl:teamplate>
?.

Я хотел бы написать отдельный js-файл, который бы описывал свойства элементов, у которых значение атрибута name=?node?. В частности прописать его повидение на onclick (при клике свойство данного элемента visibility="visible")

Подскажите, каким должен быть js-файл?

Link to comment
Share on other sites

7 answers to this question

Recommended Posts

  • 0
Подскажите, каким должен быть js-файл?

Встречный ворос: "Что получается после XLST трансформации?"

НТМL код. Собсвенно надо что бы было на выходе примерно так, например:

<div name="node" type="psevdo" class="psevdo" onclick="changeVisibility(this)"></div>
<script language="javascript" type="text/javascript">
function changeVisibility(elem) {
if (elem.style.visibility=="visible") {
elem.style.visibility="hidden";
}else{
elem.style.visibility="visible"; //ессно дело не сработает, так как элемент скрыт
}
}
</script>

Но это простейший выриант. и имеет свои баги (при первом просмотре у дива нет инлайн стиля со свойством visibility). потому решать изменение свойств надо через работу с именами CSS классов, на мой взгляд. когда-то на этом форуме были эти посты

Link to comment
Share on other sites

  • 0

too vasa_c: & Yarik Voronov

Проблема в том, что Я не знаю как так написать отдельный JS, чтобы XLS не содержал кода подобного этому:

<div name="node" type="psevdo" class="psevdo" onclick="changeVisibility(this)">

Причина в том, что Я хочу (а точнее Мой руководитель по УИРу), что бы свойства, которыми Я наделю элементы, не зависели от того что это конкретно за элемент. Значение должно иметь лишь то, что значение у данного эл-та name=?node?.

Как такой js-файл написать?

Link to comment
Share on other sites

  • 0
Причина в том, что Я хочу (а точнее Мой руководитель по УИРу), что бы свойства, которыми Я наделю элементы, не зависели от того что это конкретно за элемент. Значение должно иметь лишь то, что значение у данного эл-та name=?node?.

А могут ли любые элементы иметь атрибут name (или type, как у Вас в шаблоне)?

Как такой js-файл написать?

Написать такой файл несложно. Это может быть буквально пара-тройка функций. Одна из них, выполняемая в момент события onload объекта window, могла бы "собрать" все элементы, к примеру, в имени класса которых есть слово node, и присвоить им обработчик события onclick (это уже вторая функция)...

Link to comment
Share on other sites

  • 0

to AKS

Ваша идея Мне нравится. Возможно это то, что как раз нужно. Только вот можно Вас попросить приблизительный код "второй функции" набросать. Это та где нужно присвоить обработчик события onclick.

Отвечая на Ваш вопрос: В данном случае атрибут name="node" будут иметь заведомо только div'ы. Однако это сути не меняет. Важна идея, сама возможность присвоения name="node" любому элементу.

Link to comment
Share on other sites

  • 0
Проблема в том, что Я не знаю как так написать отдельный JS, чтобы XLS не содержал кода подобного этому:

Учись. "Нельзя пройти свой путь чужими ногами"

Причина в том, что Я хочу (а точнее Мой руководитель по УИРу), что бы свойства, которыми Я наделю элементы, не зависели от того что это конкретно за элемент. Значение должно иметь лишь то, что значение у данного эл-та name=?node?.Как такой js-файл написать?

Задача:

В результате XSL трансформации из исходного XML файла должен получиться XHTML документ,

где у всех элементов с атрибутами name="node" должен быть например белый цвет текста

Движком XSLT будет Mozilla Firefox 2.0.0.8

Список источников:

Something about XML

XSL Transformations (XSLT) Version 2.0

Wikipedia::XSLT

CSS::5.8 Attribute selectors

Решение

Исходный XML(1.xml)

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="./1.xsl"?>
<document>
<node class='term'>
<text>1_some data</text>
</node>
<node class='psevdo'>
<text>2_some data</text>
<node class='psevdo'>
<text>2.1_ some data</text>
<node class='term'>
<text>2.1.1_ some data</text>
</node>
</node>
<node class='term'>
<text>2.2_some data</text>
</node>
</node>
<test class='psevdo'>
<text>3_some data</text>
<node class='term'>
<text>3.1_ some data</text>
</node>
</test>
<node class='term'>
<text>4_some data</text>
</node>
</document>

XSL шаблон(1.xsl)

<xsl:stylesheet version="1.0" 
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns="http://www.w3.org/1999/xhtml">
<xsl:output method="xml" indent="yes"
doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN"
doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"/>


<xsl:template match="/">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>test1</title>
<style type="text/css">
body {width:50%;}
p {font-size:18px; color:red; background-color:red; margin:10px; padding: 5px;}
div {padding:5px; color:red; background-color:silver; margin:10px;}
*[name='node'] {color:white;} /*IE отдыхает*/
</style>
<script language="javascript" type="text/javascript">
function doSomeActions(e) {
elem= e.target; //IE нервно курит
with (elem.style) {
backgroundColor="blue";
color="red";
}
return e.preventDefault(); //IE нервно курит
}
</script>
</head>
<body>
<xsl:apply-templates/>
</body>
</html>
</xsl:template>

<xsl:template match="test">
<p name="node" type="psevdo" class="psevdo">
<xsl:value-of select="text"/>
<xsl:apply-templates select="node"/>
</p>
</xsl:template>

<xsl:template match="node">
<xsl:choose>
<xsl:when test="@class='psevdo'">
<div name="node" type="psevdo" class="psevdo" onclick="doSomeActions(event)">
<xsl:value-of select="text"/>
<xsl:apply-templates select="node"/>
</div>
</xsl:when>
<xsl:when test="@class='term'">
<div name="node" type="term" class="term">
<xsl:value-of select="."/>
<xsl:apply-templates select="node"/>
</div>
</xsl:when>
</xsl:choose>
</xsl:template>
</xsl:stylesheet>

как так написать отдельный JS

написать руками, думая головой, внедририть в XHTML -> http://htmlbook.ru/html/script.html

Только вот можно Вас попросить приблизительный код "второй функции" набросать. Это та где нужно присвоить обработчик события onclick.

Попросить то можно... Только исходным кодом ответят наврядли. ;)

см Java Script методы: attachEvent(), addEventListener(), getAtribute();

Link to comment
Share on other sites

  • 0

to Yarik Voronov, AKS, vasa_c.

Искренне благодарю Вас за помощь и советы. Они Мне помогли ;). Конечно же Я согласен с тем, что ?Нельзя пройти Свой путь чужими ногами?. Я лишь спросил куда идти. ?вот и пойду :). Еще раз спасибо.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy