Как определить элементы формы в IFRAME - PullRequest
Новая
       21

Как определить элементы формы в IFRAME

0 голосов
/ 08 марта 2012

Я пытаюсь определить, изменились ли value в <input type="text"> и значение в <textarea>, чтобы я мог запустить AJAX-вызов на сервер. Скрипт просто повторяется и показывает мне все id, а не только те, что в текущем IFRAME.

Я знаю, как выполнять вызов AJAX и сценарии бэкэнда, я просто не могу понять, как захватывать, если value элементов формы изменяется в любом заданном prettyPhoto IFRAME. Мои рамки prettyPhoto создаются динамически, и в FORM.

содержится более 800 элементов.

У меня есть следующий jQuery: 

jQuery.support.cors = true; // Needed for AJAX to work in certain older browsers and versions

$(document).ready(function(){

    // load each PP Frame
    $('a[rel^="prettyPhoto"]').prettyPhoto({
        social_tools: false,
        changepicturecallback: function() {
            var abc = $('input.inputText').val();
            alert(abc);
        }
    });

}); // end .ready()

Любые мысли или помощь очень ценятся. 

<form id="my-form" name="my-form"><div class="rowhighlight" style="clear:both">

<div style="clear:both">
    <p style="float:left;width:40px;text-align:right;background-color:inherit;margin:0;padding:0;margin-left:60px;padding-right:10px;"><a href="#n0076-1" rel="prettyPhoto[n0076]" title="App Title<br />2012">76</a></p>
    <div style="display:none;">
        <a href="#n0076-2" rel="prettyPhoto[n0076]" title="App Title<br />2012"></a>
        <a href="#n0076-3" rel="prettyPhoto[n0076]" title="App Title<br />2012"></a>
        <a href="#n0076-4" rel="prettyPhoto[n0076]" title="App Title<br />2012"></a>
    </div>
    <p style="float:left;width:240px;background-color:inherit;margin:0;padding:0;color:inherit;">Person 76</p>
    <p style="float:left;width:240px;background-color:inherit;margin:0;padding:0;color:inherit;">Person 76-A<span style="font-size:0.8125em;padding-left:8px;">(Type)</span></p>
    <p style="float:left;width:180px;background-color:inherit;margin:0;padding:0;color:inherit;">3/1/12 at 10:22am (Thu)</p>
    <p style="float:left;width:60px;text-align:right;background-color:inherit;margin:0;padding:0;color:inherit;">0</p>
    <p style="float:left;width:60px;text-align:right;background-color:inherit;margin:0;padding:0;color:inherit;padding-right:10px;">0.00</p>
</div>

<div id="n0076-1" style="display:none;width:600px;">
<h1 style="float:left;margin:6px 0 8px 6px;padding:0;border:none;">Header 1</h1>
<h2 style="float:right;margin:9px 8px; 8px 0;padding:0;border:none;">Header 2</h2>
<div style="clear:both;margin:0 6px;padding:4px 10px;background-color:#dedede">

    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888">Name 1:</span> <span style="font-weight:bold">Person 76</span></p>
    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888;padding-right:11px">Name 2:</span>Person 76-A (Type)&nbsp;&nbsp;&bull;&nbsp;&nbsp;Description</p>
    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888;padding-right:9px">Date:</span> March 1, 2012 at 10:22am</p>
</div>

<div style="color:#333;text-align:left;padding-left:4px;margin:0;padding-right:10px;font-size:0.875em;line-height:1.375em;margin-top:10px">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer a magna et massa ultrices porta ut a sem. Nulla eu mauris eget nunc sagittis ornare. Mauris convallis posuere nisi, non posuere turpis mattis ut. Quisque venenatis, dolor ac placerat posuere, velit purus adipiscing libero, eu suscipit nibh justo non nunc. Praesent non odio in nunc tempus volutpat sed ac metus. Nam eleifend adipiscing ipsum, ultricies adipiscing purus accumsan eu. Nulla tincidunt tincidunt varius. Sed non aliquet nunc. Mauris in pulvinar eros. Ut elementum pulvinar interdum. Fusce pulvinar posuere sollicitudin. Nam ultricies auctor sapien, quis eleifend ipsum pharetra hendrerit.</div><!--start form 1-->
<div style="margin-top:36px;display:block"><input class="textInput" id="es_user_2012_0076_1" type="text" value="0" style="float:left;margin:0 2px 0 2px;padding:0;width:60px;height:60px;border:1px solid #999;color:#777;text-align:center;font-size:3.5em;" /><textarea class="noteInput" onFocus="$(this).val('')" id="en_user_2012_0076_1" style="float:left;margin:0 2px 0 2px;padding:2px;width:424px;height:56px;border:1px solid #999;color:#369;text-align:left;font-size:0.75em;">In box to left, enter 1-5 (1=low &amp; 5=high). Use this box for optional notes.</textarea></div>
<!--end form 1-->
<div style="clear:both;"></div></div> <!-- end 0076-1 -->
<div id="n0076-2" style="display:none;width:600px;">
<h1 style="float:left;margin:6px 0 8px 6px;padding:0;border:none;">Header 1</h1>
<h2 style="float:right;margin:9px 8px; 8px 0;padding:0;border:none;">Header 2</h2>
<div style="clear:both;margin:0 6px;padding:4px 10px;background-color:#dedede">
    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888">Name 1:</span> <span style="font-weight:bold">Person 76</span></p>

    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888;padding-right:11px">Name 2:</span>Person 76-A (Type)&nbsp;&nbsp;&bull;&nbsp;&nbsp;Description</p>
    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888;padding-right:9px">Date:</span> March 1, 2012 at 10:22am</p>
</div>
<div style="color:#333;text-align:left;padding-left:4px;margin:0;padding-right:10px;font-size:0.875em;line-height:1.375em;margin-top:10px">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer a magna et massa ultrices porta ut a sem. Nulla eu mauris eget nunc sagittis ornare. Mauris convallis posuere nisi, non posuere turpis mattis ut. Quisque venenatis, dolor ac placerat posuere, velit purus adipiscing libero, eu suscipit nibh justo non nunc. Praesent non odio in nunc tempus volutpat sed ac metus. Nam eleifend adipiscing ipsum, ultricies adipiscing purus accumsan eu. Nulla tincidunt tincidunt varius. Sed non aliquet nunc. Mauris in pulvinar eros. Ut elementum pulvinar interdum. Fusce pulvinar posuere sollicitudin. Nam ultricies auctor sapien, quis eleifend ipsum pharetra hendrerit.</div><!--start form 2-->
<div style="margin-top:36px;display:block"><input class="textInput" id="es_user_2012_0076_2" type="text" value="0" style="float:left;margin:0 2px 0 2px;padding:0;width:60px;height:60px;border:1px solid #999;color:#777;text-align:center;font-size:3.5em;" /><textarea class="noteInput" onFocus="$(this).val('')" id="en_user_2012_0076_2" style="float:left;margin:0 2px 0 2px;padding:2px;width:424px;height:56px;border:1px solid #999;color:#369;text-align:left;font-size:0.75em;">In box to left, enter 1-5 (1=low &amp; 5=high). Use this box for optional notes.</textarea></div>
<!--end form 2-->

<div style="clear:both;"></div></div> <!-- end 0076-2 -->
<div id="n0076-3" style="display:none;width:600px;">
<h1 style="float:left;margin:6px 0 8px 6px;padding:0;border:none;">Header 1</h1>
<h2 style="float:right;margin:9px 8px; 8px 0;padding:0;border:none;">Header 2</h2>
<div style="clear:both;margin:0 6px;padding:4px 10px;background-color:#dedede">
    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888">Name 1:</span> <span style="font-weight:bold">Person 76</span></p>
    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888;padding-right:11px">Name 2:</span>Person 76-A (Type)&nbsp;&nbsp;&bull;&nbsp;&nbsp;Description</p>

    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888;padding-right:9px">Date:</span> March 1, 2012 at 10:22am</p>
</div>
<div style="color:#333;text-align:left;padding-left:4px;margin:0;padding-right:10px;font-size:0.875em;line-height:1.375em;margin-top:10px">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer a magna et massa ultrices porta ut a sem. Nulla eu mauris eget nunc sagittis ornare. Mauris convallis posuere nisi, non posuere turpis mattis ut. Quisque venenatis, dolor ac placerat posuere, velit purus adipiscing libero, eu suscipit nibh justo non nunc. Praesent non odio in nunc tempus volutpat sed ac metus. Nam eleifend adipiscing ipsum, ultricies adipiscing purus accumsan eu. Nulla tincidunt tincidunt varius. Sed non aliquet nunc. Mauris in pulvinar eros. Ut elementum pulvinar interdum. Fusce pulvinar posuere sollicitudin. Nam ultricies auctor sapien, quis eleifend ipsum pharetra hendrerit.</div><!--start form 3-->
<div style="margin-top:36px;display:block"><input class="textInput" id="es_user_2012_0076_3" type="text" value="0" style="float:left;margin:0 2px 0 2px;padding:0;width:60px;height:60px;border:1px solid #999;color:#777;text-align:center;font-size:3.5em;" /><textarea class="noteInput" onFocus="$(this).val('')" id="en_user_2012_0076_3" style="float:left;margin:0 2px 0 2px;padding:2px;width:424px;height:56px;border:1px solid #999;color:#369;text-align:left;font-size:0.75em;">In box to left, enter 1-5 (1=low &amp; 5=high). Use this box for optional notes.</textarea></div>
<!--end form 3-->
<div style="clear:both;"></div></div> <!-- end 0076-3 -->
<div id="n0076-4" style="display:none;width:600px;">
<h1 style="float:left;margin:6px 0 8px 6px;padding:0;border:none;">Header 1</h1>
<h2 style="float:right;margin:9px 8px; 8px 0;padding:0;border:none;">Header 2</h2>

<div style="clear:both;margin:0 6px;padding:4px 10px;background-color:#dedede">
    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888">Name 1:</span> <span style="font-weight:bold">Person 76</span></p>
    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888;padding-right:11px">Name 2:</span>Person 76-A (Type)&nbsp;&nbsp;&bull;&nbsp;&nbsp;Description</p>
    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888;padding-right:9px">Date:</span> March 1, 2012 at 10:22am</p>

</div>
<div style="color:#333;text-align:left;padding-left:4px;margin:0;padding-right:10px;font-size:0.875em;line-height:1.375em;margin-top:10px"><span class="ltOrange">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer a magna et massa ultrices porta ut a sem. Nulla eu mauris eget nunc sagittis ornare. Mauris convallis posuere nisi, non posuere turpis mattis ut. Quisque venenatis, dolor ac placerat posuere, velit purus adipiscing libero, eu suscipit nibh justo non nunc. Praesent non odio in nunc tempus volutpat sed ac metus. Nam eleifend adipiscing ipsum, ultricies adipiscing purus accumsan eu. Nulla tincidunt tincidunt varius. Sed non aliquet nunc. Mauris in pulvinar eros. Ut elementum pulvinar interdum. Fusce pulvinar posuere sollicitudin. Nam ultricies auctor sapien, quis eleifend ipsum pharetra hendrerit.</span></div><div style="clear:both;border-bottom:1px solid #ccc;padding-top:20px;"></div></div> <!-- end 0076-4 -->
<div class="rowhighlight" style="clear:both">

    <p style="float:left;width:40px;text-align:right;background-color:inherit;margin:0;padding:0;margin-left:60px;padding-right:10px;"><a href="#n0108-1" rel="prettyPhoto[n0108]" title="App Title<br />2012">108</a></p>
    <div style="display:none;">
        <a href="#n0108-2" rel="prettyPhoto[n0108]" title="App Title<br />2012"></a>
        <a href="#n0108-3" rel="prettyPhoto[n0108]" title="App Title<br />2012"></a>
        <a href="#n0108-4" rel="prettyPhoto[n0108]" title="App Title<br />2012"></a>
    </div>
    <p style="float:left;width:240px;background-color:inherit;margin:0;padding:0;color:inherit;">Person 108</p>
    <p style="float:left;width:240px;background-color:inherit;margin:0;padding:0;color:inherit;">Person 108-A<span style="font-size:0.8125em;padding-left:8px;">(Type)</span></p>
    <p style="float:left;width:180px;background-color:inherit;margin:0;padding:0;color:inherit;">3/2/12 at 11:12pm (Fri)</p>
    <p style="float:left;width:60px;text-align:right;background-color:inherit;margin:0;padding:0;color:inherit;">0</p>
    <p style="float:left;width:60px;text-align:right;background-color:inherit;margin:0;padding:0;color:inherit;padding-right:10px;">0.00</p>
</div>

<div id="n0108-1" style="display:none;width:600px;">
<h1 style="float:left;margin:6px 0 8px 6px;padding:0;border:none;">Header 1</h1>
<h2 style="float:right;margin:9px 8px; 8px 0;padding:0;border:none;">Header 2</h2>
<div style="clear:both;margin:0 6px;padding:4px 10px;background-color:#dedede">
    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888">Name 1:</span> <span style="font-weight:bold">Person 108</span></p>

    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888;padding-right:11px">Name 2:</span>Person 108-A (Type)&nbsp;&nbsp;&bull;&nbsp;&nbsp;Description</p>
    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888;padding-right:9px">Date:</span> March 2, 2012 at 11:12pm</p>
</div>
<div style="color:#333;text-align:left;padding-left:4px;margin:0;padding-right:10px;font-size:0.875em;line-height:1.375em;margin-top:10px">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer a magna et massa ultrices porta ut a sem. Nulla eu mauris eget nunc sagittis ornare. Mauris convallis posuere nisi, non posuere turpis mattis ut. Quisque venenatis, dolor ac placerat posuere, velit purus adipiscing libero, eu suscipit nibh justo non nunc. Praesent non odio in nunc tempus volutpat sed ac metus. Nam eleifend adipiscing ipsum, ultricies adipiscing purus accumsan eu. Nulla tincidunt tincidunt varius. Sed non aliquet nunc. Mauris in pulvinar eros. Ut elementum pulvinar interdum. Fusce pulvinar posuere sollicitudin. Nam ultricies auctor sapien, quis eleifend ipsum pharetra hendrerit.</div><!--start form 1-->
<div style="margin-top:36px;display:block"><input class="textInput" id="es_user_2012_0108_1" type="text" value="0" style="float:left;margin:0 2px 0 2px;padding:0;width:60px;height:60px;border:1px solid #999;color:#777;text-align:center;font-size:3.5em;" /><textarea class="noteInput" onFocus="$(this).val('')" id="en_user_2012_0108_1" style="float:left;margin:0 2px 0 2px;padding:2px;width:424px;height:56px;border:1px solid #999;color:#369;text-align:left;font-size:0.75em;">In box to left, enter 1-5 (1=low &amp; 5=high). Use this box for optional notes.</textarea></div>
<!--end form 1-->

<div style="clear:both;"></div></div> <!-- end 0108-1 -->
<div id="n0108-2" style="display:none;width:600px;">
<h1 style="float:left;margin:6px 0 8px 6px;padding:0;border:none;">Header 1</h1>
<h2 style="float:right;margin:9px 8px; 8px 0;padding:0;border:none;">Header 2</h2>
<div style="clear:both;margin:0 6px;padding:4px 10px;background-color:#dedede">
    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888">Name 1:</span> <span style="font-weight:bold">Person 108</span></p>
    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888;padding-right:11px">Name 2:</span>Person 108-A (Type)&nbsp;&nbsp;&bull;&nbsp;&nbsp;Description</p>

    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888;padding-right:9px">Date:</span> March 2, 2012 at 11:12pm</p>
</div>
<div style="color:#333;text-align:left;padding-left:4px;margin:0;padding-right:10px;font-size:0.875em;line-height:1.375em;margin-top:10px">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer a magna et massa ultrices porta ut a sem. Nulla eu mauris eget nunc sagittis ornare. Mauris convallis posuere nisi, non posuere turpis mattis ut. Quisque venenatis, dolor ac placerat posuere, velit purus adipiscing libero, eu suscipit nibh justo non nunc. Praesent non odio in nunc tempus volutpat sed ac metus. Nam eleifend adipiscing ipsum, ultricies adipiscing purus accumsan eu. Nulla tincidunt tincidunt varius. Sed non aliquet nunc. Mauris in pulvinar eros. Ut elementum pulvinar interdum. Fusce pulvinar posuere sollicitudin. Nam ultricies auctor sapien, quis eleifend ipsum pharetra hendrerit.</div><!--start form 2-->
<div style="margin-top:36px;display:block"><input class="textInput" id="es_user_2012_0108_2" type="text" value="0" style="float:left;margin:0 2px 0 2px;padding:0;width:60px;height:60px;border:1px solid #999;color:#777;text-align:center;font-size:3.5em;" /><textarea class="noteInput" onFocus="$(this).val('')" id="en_user_2012_0108_2" style="float:left;margin:0 2px 0 2px;padding:2px;width:424px;height:56px;border:1px solid #999;color:#369;text-align:left;font-size:0.75em;">In box to left, enter 1-5 (1=low &amp; 5=high). Use this box for optional notes.</textarea></div>
<!--end form 2-->
<div style="clear:both;"></div></div> <!-- end 0108-2 -->
<div id="n0108-3" style="display:none;width:600px;">
<h1 style="float:left;margin:6px 0 8px 6px;padding:0;border:none;">Header 1</h1>
<h2 style="float:right;margin:9px 8px; 8px 0;padding:0;border:none;">Header 2</h2>

<div style="clear:both;margin:0 6px;padding:4px 10px;background-color:#dedede">
    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888">Name 1:</span> <span style="font-weight:bold">Person 108</span></p>
    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888;padding-right:11px">Name 2:</span>Person 108-A (Type)&nbsp;&nbsp;&bull;&nbsp;&nbsp;Description</p>
    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888;padding-right:9px">Date:</span> March 2, 2012 at 11:12pm</p>

</div>
<div style="color:#333;text-align:left;padding-left:4px;margin:0;padding-right:10px;font-size:0.875em;line-height:1.375em;margin-top:10px">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer a magna et massa ultrices porta ut a sem. Nulla eu mauris eget nunc sagittis ornare. Mauris convallis posuere nisi, non posuere turpis mattis ut. Quisque venenatis, dolor ac placerat posuere, velit purus adipiscing libero, eu suscipit nibh justo non nunc. Praesent non odio in nunc tempus volutpat sed ac metus. Nam eleifend adipiscing ipsum, ultricies adipiscing purus accumsan eu. Nulla tincidunt tincidunt varius. Sed non aliquet nunc. Mauris in pulvinar eros. Ut elementum pulvinar interdum. Fusce pulvinar posuere sollicitudin. Nam ultricies auctor sapien, quis eleifend ipsum pharetra hendrerit.</div><!--start form 3-->
<div style="margin-top:36px;display:block"><input class="textInput" id="es_user_2012_0108_3" type="text" value="0" style="float:left;margin:0 2px 0 2px;padding:0;width:60px;height:60px;border:1px solid #999;color:#777;text-align:center;font-size:3.5em;" /><textarea class="noteInput" onFocus="$(this).val('')" id="en_user_2012_0108_3" style="float:left;margin:0 2px 0 2px;padding:2px;width:424px;height:56px;border:1px solid #999;color:#369;text-align:left;font-size:0.75em;">In box to left, enter 1-5 (1=low &amp; 5=high). Use this box for optional notes.</textarea></div>
<!--end form 3-->
<div style="clear:both;"></div></div> <!-- end 0108-3 -->
<div id="n0108-4" style="display:none;width:600px;">
<h1 style="float:left;margin:6px 0 8px 6px;padding:0;border:none;">Header 1</h1>
<h2 style="float:right;margin:9px 8px; 8px 0;padding:0;border:none;">Header 2</h2>
<div style="clear:both;margin:0 6px;padding:4px 10px;background-color:#dedede">
    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888">Name 1:</span> <span style="font-weight:bold">Person 108</span></p>

    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888;padding-right:11px">Name 2:</span>Person 108-A (Type)&nbsp;&nbsp;&bull;&nbsp;&nbsp;Description</p>
    <p style="color:#333;text-align:left;padding:0;margin:0;font-size:0.6875em;line-height:1.25em;"><span style="color:#888;padding-right:9px">Date:</span> March 2, 2012 at 11:12pm</p>
</div>
<div style="color:#333;text-align:left;padding-left:4px;margin:0;padding-right:10px;font-size:0.875em;line-height:1.375em;margin-top:10px">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer a magna et massa ultrices porta ut a sem. Nulla eu mauris eget nunc sagittis ornare. Mauris convallis posuere nisi, non posuere turpis mattis ut. Quisque venenatis, dolor ac placerat posuere, velit purus adipiscing libero, eu suscipit nibh justo non nunc. Praesent non odio in nunc tempus volutpat sed ac metus. Nam eleifend adipiscing ipsum, ultricies adipiscing purus accumsan eu. Nulla tincidunt tincidunt varius. Sed non aliquet nunc. Mauris in pulvinar eros. Ut elementum pulvinar interdum. Fusce pulvinar posuere sollicitudin. Nam ultricies auctor sapien, quis eleifend ipsum pharetra hendrerit.</div><!--start form 4-->
<div style="margin-top:36px;display:block"><input class="textInput" id="es_user_2012_0108_4" type="text" value="0" style="float:left;margin:0 2px 0 2px;padding:0;width:60px;height:60px;border:1px solid #999;color:#777;text-align:center;font-size:3.5em;" /><textarea class="noteInput" onFocus="$(this).val('')" id="en_user_2012_0108_4" style="float:left;margin:0 2px 0 2px;padding:2px;width:424px;height:56px;border:1px solid #999;color:#369;text-align:left;font-size:0.75em;">In box to left, enter 1-5 (1=low &amp; 5=high). Use this box for optional notes.</textarea></div>
<!--end form 4-->

<div style="clear:both;"></div></div> <!-- end 0108-4 -->

</div></form>

P.S. Я знаю, как использовать таблицы стилей, и когда я закончу разработку, я перенесу все стили в таблицу. У меня есть умение (возможно, плохая привычка) встроенного стиля во время разработки, потому что вещи меняются слишком часто, и я предпочитаю работать над 1 документом за раз.

Следующая попытка с использованием ответа [at] JF 

<script>

jQuery.support.cors = true; // needed for ajax to work in certain older browsers and versions

$(document).ready(function(){

/*
    // load scores and notes in each PP Frame
    $('a[rel^="prettyPhoto"]').prettyPhoto({
        social_tools: false,
        changepicturecallback: function() {
            var abc = $('input.inputText').val();
            //alert(abc);
        }
    });
*/

    var $pps = $("a[rel^=prettyPhoto]"),
        $inputs = $('input.textInput'),
        $textinputscls = $('.textInput'),
        $textinputs = $('input.textInput');

    var ppcallback = function(){
        $textinputs = $('input.textInput');

        //console.log($textinputs); // don't need
        //console.log($textinputs.val()); // don't need
        console.log('id: ' + $textinputs.attr('id')); // very close...returns 1st ID only
    };

    $pps.prettyPhoto({
        social_tools: false,
        changepicturecallback: ppcallback
    });

    //console.log($pps); // don't need

    // post scores and notes each time they change -- THIS WORKS
    $(this).change(function(e) {
        var elemId = e.target.id;
        var elemValue = e.target.value;
        $.ajax({
            url: "http://mydomain.com/dir/ajax/updateMySQL.php?actionString=" + elemId + '_' + elemValue
        });
    });

}); // end .ready()

//  window.parent.closePP();

</script>

1 Ответ

1 голос
/ 09 марта 2012

Хорошо, используя следующий код, я смог получить то, что, как я полагаю, вы хотите сделать, а именно элементы доступа, которые находятся внутри дисплеев prettyPhoto.Позже мне придется дать более подробный ответ, поэтому не стесняйтесь оставлять комментарии, если у вас есть какие-либо вопросы.

Также обратите внимание, что вам нужно открыть консоль, чтобы увидеть код "работа";вывод на console.log(). 

<script>
jQuery(document).ready(function($){
    var $pps = $("a[rel^=prettyPhoto]"),
        $inputs = $('input.textInput'),
        $textinputscls = $('.textInput'),
        $textinputs = $('input.textInput');

    var ppcallback = function(){
        $textinputs = $('input.textInput');

        console.log($textinputs);
        console.log($textinputs.val());
    };

    $pps.prettyPhoto({
        social_tools: false,
        changepicturecallback: ppcallback
    });

    console.log($pps);
});
</script>

http://jfcoder.com/test/prettyphotoiframe.html

...