Select Element in a Namespace using $.delegate()

I am inlining an external svg that has a text element. I want the content of the text element to mirror a text field from the page. If the user edits the text field, it should update the text element in the svg, and 开发者_Go百科vice versa. I've got this working using $.bind().

The user can select a different svg. The original svg gets removed and a new one loads in. The text element is in both svgs, it's just a different graphic.

So I really need $.delegate() not $.bind(). How do I write that syntax? This doesn't work:

$('#svg_container').delegate('svg text', 'keyup click', function() {
});

Neither does this:

$('#svg_container').delegate('text', 'keyup click', function() {
});

---

As jQuery's selector engine Sizzle doesn't support XML namespaces, you can simply treat the colon as part of the element name by escaping it:

$('#svg_container').delegate('svg\\:text', 'keyup click', function() {
});

Two backslashes because the first escapes the second in JavaScript. Then the escaped backslash escapes the colon for the jQuery selector.

---

Your code seems to be right, assuming you wrote 'svg' and 'text' selectors for explaining purposes. Are you sure you wrote your selectors right? Shouldn't it have been:

$('#svg_container').delegate('svg :text', 'keyup click', function() {
});

or maybe text/svg are class names or ids? Hope this helps